javascript 面向对象编程基础:封装


Posted in Javascript onAugust 21, 2009

很长一段时间以来(这里本人要幸灾乐祸地说),js是“一种点缀的作用,完成很有限的功能,诸如表单验证之类,其语言本身也一直被当作过程化的语言使用,很难完成复杂的功能。”。但是(这里本人要苦大仇深、痛心疾首地说),“而Ajax的出现使得复杂脚本成为必需的组成部分,这就对 JavaScript 程序设计提出了新的要求,很多Ajax应用开始利用JavaScript面向对象的性质进行开发,使逻辑更加清晰。事实上,JavaScript 提供了完善的机制来实现面向对象的开发思想。”。额的神啊,本来就不想学不敢学的,现在不得不硬着头皮学了。
这里关于对象就废话这么多了。我们都知道面向对象编程的三个主要特点是:封装、继承和多态。下面就围绕着这三个特点,记录一些学习心得。
好的,先从封装性开始介绍,众所周知,对象是封装的最基本单位。封装防止了程序相互依赖性而带来的变动影响。面向对象的封装比传统语言的封装更为清晰、更为有力。Code is cheap.来看简单的代码:

// 定义函数的方式定义类
function class1() {
// 类成员的定义及构造函数
// 这里class1 既是一个函数也是一个类。作为函数,它可以理解为类的构造函数, 负责初始化的工作。
}

// 使用new操作符获得一个类的实例
var obj = new class1();
/* 抛开类的概念,从代码的形式上来看,class1 就是一个函数,那么是不是所有的函数都可以用new来操作呢?答案是肯定的。
在JavaScript 中,函数和类就是一个概念,当new 一个函数时,就会返回一个对象。如果这个函数中没有初始化类成员,那就会返回一个空的对象。
事实上,当new一个函数时,这个函数就是所代表类的构造函数,其中的所有代码都可以看作为了初始化一个对象而工作。用于表示类的函数也称之为构造器。
在JavaScript 中,每个对象可以看作是多个属性(方法)的集合
*/

function test() {
alert( typeof (obj));
}

上面的代码定义了一个类class1,这就是js中简单的封装,下面我们看js如何定义“静态类”,

function class1() { // 构造函数
}
// 静态属性
class1.staticProperty = " test " ;
// 静态方法
class1.staticMethod = function () {
alert(class1.staticProperty);
}

function test() {
// 调用静态方法
class1.staticMethod();
alert( typeof (class1));

}

接着看“抽象类”:

/*
在传统面向对象语言中,抽象类中的虚方法必须先被声明,但可以在其他方法中被调用。
而在JavaScript 中,虚方法就可以看 该类中没有定义的方法,但已经通过this 指针使用了。
和传统面向对象不同的是,这里虚方法不需经过声明,而直接使用了。这些方法将在派生类
中实现
*/

// 定义extend 方法
Object.extend = function (destination, source) {
for (property in source) {
destination[property] = source[property];
}
return destination;
}
Object.prototype.extend = function (object) {
return Object.extend.apply( this , [ this , object]);
}
// 定义一个抽象基类base,无构造函数
function base() { }
base.prototype = {
initialize: function () {
this .oninit(); // 调用了一个虚方法
}
}
// 定义class1
function class1() {
// 构造函数
}
// 让class1继承于base 并实现其中的oninit方法
class1.prototype = ( new base()).extend({
oninit: function () { // 实现抽象基类中的oninit 虚方法
// oninit 函数的实现
}
});

我们看到,上面“让class1继承于base 并实现其中的oninit方法时”,使用了“继承”的概念,请留意。再来看一下执行的效果:

function test() {
var obj = new class1();
obj.oninit = function () { alert( " test " ); }
obj.oninit();
}

Javascript 相关文章推荐
Javascript 的addEventListener()及attachEvent()区别分析
May 21 Javascript
javascript中interval与setTimeOut的区别示例介绍
Mar 14 Javascript
Jquery 实现弹出层插件
Jan 28 Javascript
javascript搜索框效果实现方法
May 14 Javascript
JavaScript时间操作之年月日星期级联操作
Jan 15 Javascript
node.js实现端口转发
Apr 14 Javascript
AngularJS $injector 依赖注入详解
Sep 14 Javascript
BootStrap Table对前台页面表格的支持实例讲解
Dec 22 Javascript
JavaScript实现各种排序的代码详解
Aug 28 Javascript
Vue 进入/离开动画效果
Dec 26 Javascript
OpenLayers加载缩放控件使用方法详解
Sep 25 Javascript
Vue解决移动端弹窗滚动穿透问题
Dec 15 Vue.js
javascript arguments 传递给函数的隐含参数
Aug 21 #Javascript
javascript 自定义事件初探
Aug 21 #Javascript
IE 下的只读 innerHTML
Aug 21 #Javascript
JS 控制CSS样式表
Aug 20 #Javascript
JS获取父节点方法
Aug 20 #Javascript
javascript 数组排序函数
Aug 20 #Javascript
用Javascript数组处理多个字符串的连接问题
Aug 20 #Javascript
You might like
php数据库密码的找回的步骤
2011/01/12 PHP
linux下使用ThinkPHP需要注意大小写导致的问题
2011/08/02 PHP
在smarty中调用php内置函数的方法
2013/02/07 PHP
PHP循环函数使用介绍之PHP基础入门教程
2013/09/21 PHP
php实现二进制和文本相互转换的方法
2015/04/18 PHP
php使用APC实现实时上传进度条功能
2015/10/26 PHP
thinkphp5.0自定义验证规则使用方法
2017/11/16 PHP
Laravel Eloquent分表方法并使用模型关联的实现
2019/11/25 PHP
PHP dirname(__FILE__)原理及用法解析
2020/10/28 PHP
js 刷新页面的代码小结 推荐
2010/04/02 Javascript
JavaScript高级程序设计 阅读笔记(十八) js跨平台的事件
2012/08/14 Javascript
5秒后跳转效果(setInterval/SetTimeOut)
2013/05/03 Javascript
JSCode all of Brower 全局屏蔽网页右键功能 具体实现
2013/06/05 Javascript
JQUERY 获取IFrame中对象及获取其父窗口中对象示例
2013/08/19 Javascript
浅谈Javascript事件对象
2017/02/05 Javascript
详解Node 定时器
2018/02/26 Javascript
原生JS实现前端本地文件上传
2018/09/08 Javascript
iview通过Dropdown(下拉菜单)实现的右键菜单
2018/10/26 Javascript
2019年度web前端面试题总结(主要为Vue面试题)
2020/01/12 Javascript
初学Python函数的笔记整理
2015/04/07 Python
简要讲解Python编程中线程的创建与锁的使用
2016/02/28 Python
实例讲解Python设计模式编程之工厂方法模式的使用
2016/03/02 Python
Python中用字符串调用函数或方法示例代码
2017/08/04 Python
用 Python 爬了爬自己的微信朋友(实例讲解)
2017/08/25 Python
Python获取系统所有进程PID及进程名称的方法示例
2018/05/24 Python
Python模块/包/库安装的六种方法及区别
2020/02/24 Python
完美解决pycharm 不显示代码提示问题
2020/06/02 Python
四年大学生活的自我评价范文
2014/02/07 职场文书
洗车工岗位职责
2014/03/15 职场文书
美丽家庭事迹材料
2014/05/03 职场文书
献爱心捐款倡议书
2014/05/14 职场文书
毕业生学校推荐信范文
2014/05/21 职场文书
2014年单位工作总结范文
2014/11/27 职场文书
党员民主生活会材料
2014/12/15 职场文书
Lombok的详细使用及优缺点总结
2021/07/15 Java/Android
openEuler 搭建java开发环境的详细过程
2022/06/10 Servers