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动画之圆形运动,环绕鼠标运动作小球
Jul 20 Javascript
jQuery动态添加的元素绑定事件处理函数代码
Aug 02 Javascript
JS基础之undefined与null的区别分析
Aug 08 Javascript
extjs关于treePanel+chekBox全部选中以及清空选中问题探讨
Apr 02 Javascript
Jquery数字上下滚动动态切换插件
Aug 08 Javascript
使用jQuery的load方法设计动态加载及解决被加载页面js失效问题
Mar 01 Javascript
js实现简易聊天对话框
Aug 17 Javascript
基于JavaScript实现表格滚动分页
Nov 22 Javascript
TypeScript之调用栈的实现
Dec 31 Javascript
JS实现旋转木马轮播图
Jan 01 Javascript
详谈Object.defineProperty 及实现数据双向绑定
Jul 18 Javascript
在vue中给后台接口传的值为数组的格式代码
Nov 12 Javascript
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开发模式(简写版)
2007/03/15 PHP
swfupload 多文件上传实现代码
2008/08/27 PHP
PHP $_SERVER详解
2009/01/16 PHP
php中cookie的使用方法
2014/03/29 PHP
Yii框架参数配置文件params用法实例分析
2019/09/11 PHP
JQuery AJAX实现目录浏览与编辑的代码
2008/10/21 Javascript
JS setCapture 区域外事件捕捉
2010/03/18 Javascript
JS面向对象编程浅析
2011/08/28 Javascript
jquery 实现二级/三级/多级联动菜单的思路及代码
2013/04/08 Javascript
js脚本获取webform服务器控件的方法
2014/05/16 Javascript
深入理解JavaScript系列(29):设计模式之装饰者模式详解
2015/03/03 Javascript
JS如何判断是否为ie浏览器的方法(包括IE10、IE11在内)
2015/12/13 Javascript
JavaScript判断数组重复内容的两种方法(推荐)
2016/06/06 Javascript
JS对大量数据进行多重过滤的方法
2016/11/04 Javascript
JS扩展String.prototype.format字符串拼接的功能
2018/03/09 Javascript
JQuery Ajax动态加载Table数据的实例讲解
2018/08/09 jQuery
js字符串倒序的实例代码
2018/11/30 Javascript
vue子传父关于.sync与$emit的实现
2019/11/05 Javascript
layui清除radio的选中状态实例
2019/11/14 Javascript
vue+高德地图实现地图搜索及点击定位操作
2020/09/09 Javascript
python类继承用法实例分析
2014/10/10 Python
Python读取环境变量的方法和自定义类分享
2014/11/22 Python
Python自定义函数实现求两个数最大公约数、最小公倍数示例
2018/05/21 Python
Python运维之获取系统CPU信息的实现方法
2018/06/11 Python
使用python来调用CAN通讯的DLL实现方法
2019/07/03 Python
Python符号计算之实现函数极限的方法
2019/07/15 Python
Window系统下Python如何安装OpenCV库
2020/03/05 Python
Tensorflow中批量读取数据的案列分析及TFRecord文件的打包与读取
2020/06/30 Python
python实现图像外边界跟踪操作
2020/07/13 Python
python openCV实现摄像头获取人脸图片
2020/08/20 Python
埃弗顿足球俱乐部官方网上商店:Everton Direct
2018/01/13 全球购物
银行会计财务工作个人的自我评价
2013/10/29 职场文书
党支部公开承诺践诺书
2014/03/28 职场文书
旷课检讨书
2015/01/26 职场文书
2016年度农村党员干部主题教育活动总结
2016/04/06 职场文书
python运算符之与用户交互
2022/04/13 Python