javascript 面向对象特性与编程实现
2012-01-07 19:46
866 查看
在 06 年用 javascript 写过上千行的应用,现在的项目中经常用到 javascript ,说不熟悉吧也熟悉了。说熟悉吧, javascript 的面向对象部分还是比较陌生。实际上自己没有系统学习过 javascript ,没有完整看过一本 javascript 的书。今天决定网上定两本书,一本是《 javascript 高级程序设计》《 javascript dom 编程艺术》,想着也该较系统的学习一下,项目中也要大量应用到这些了,必定下一个项目我们将采用 AJAX 。总结下自己学 ajax 时候补充的一点 javascript 知识。
一、 javascript 面向对象特性
1. javascript 中的函数
javascript 的 function 对象在调用过程中具有一个 arguments 属性,它是由脚本解释器创建的,这也是创建 arguments 唯一途径。 Arguments 对象可以看作是一个 Array 对象,它具有 length 属性,可以通过序号访问每一个参数。 Arguments 有个 callee 属性,可以获取到执行的 function 对象的引用。
eg :
上例利用 callee 属性实现了匿名的递归调用。
2. apply 和 call 方法:
apply 方法和 call 方法有形似之处,两者都将函数绑定到其他对象上执行。
举例:
obj1.fun1.apply(obj2,[“test”]);
含义:是将 obj1 对象的方法 fun1 绑定到 对象 obj2 上,并使用参数 test 。
obj1.fun1.call(obj2,“test”);
含义同上,他们区别是在 apply 参数以 array 对象传入。而 call 是依次传入参数的。
3. this 和 with
this 在对象的方法被调用时候,指代调用该方法的对象实例。
使用 with 语句时,代码变得更加短且易读:
没有用 with 之前
用 with 之后,就变成:
4. for in
在 javascript 中可以使用 for in 语句遍历对象中所有属性和方法。例如下面的代码就遍历了 test1 对象的属性和方法,如果是属性则输出属性值,如果是方法则执行方法。
二、 javascript 面向对象编程实现
对比 java 中面向对象编程中继承,以及封装,多态等常见概念,进行总结。
1. 类的声明
首先来看下类的实现,前面已经使用了一种声明类的方法。
上面代码声明了两个公有属性,和一个方法。大家都知道类里除了公有成员还可能还有一些私有成员变量,但是 javascript 并没有提供相应的机制来定义私有成员变量,不过利用一些 javascript 的小技巧就可以实现私有成员变量。如下:
实际上没有感觉到 javascript 中静态的必要性(不像 java ),也许是我对书本理解的不够,或者是应用太少。如果有读者朋友,有不同认识,欢迎发表看法,大家交流。
如果要声明一个类的实例属性或方法,可以使用 javascript 中对象的 prototype 属性。例如:
利用 prototype 属性,可以实现另外一种类的声明方式:
上面使用 {} 的方式声明了一个匿名对象,大括号内用逗号将属性与值的列表分隔开。可以看到,采用 prototype 的方式声明类,代码更加简洁明了。因此这种方式在很多AJAX 框架中得到广泛应用。
2. 继承
javascript 本身并没有提供继承,那么如何实现类的继承呢?最直接大方法是复制原方法,然后在里面加入新成员。但这样做实在是落后,因为当原类变化,新继承的类还要手动变化,容易出错。而下面这种用 for in 控制的复制就不那么容易出错了。
3. 多态
多态的是实现可以采用和继承类似的方法。首先定义一个抽象类,其中可以调用一些虚方法,虚方法在抽象类中没有定义,而是通过其具体实现类来实现的。
一、 javascript 面向对象特性
1. javascript 中的函数
javascript 的 function 对象在调用过程中具有一个 arguments 属性,它是由脚本解释器创建的,这也是创建 arguments 唯一途径。 Arguments 对象可以看作是一个 Array 对象,它具有 length 属性,可以通过序号访问每一个参数。 Arguments 有个 callee 属性,可以获取到执行的 function 对象的引用。
eg :
funtion f1 ( n ) { if(n<=0) { return 1; }else { return n*arguments.callee(n-1);// 实际同 return n*f1(n-1); }
上例利用 callee 属性实现了匿名的递归调用。
2. apply 和 call 方法:
apply 方法和 call 方法有形似之处,两者都将函数绑定到其他对象上执行。
举例:
obj1.fun1.apply(obj2,[“test”]);
含义:是将 obj1 对象的方法 fun1 绑定到 对象 obj2 上,并使用参数 test 。
obj1.fun1.call(obj2,“test”);
含义同上,他们区别是在 apply 参数以 array 对象传入。而 call 是依次传入参数的。
3. this 和 with
this 在对象的方法被调用时候,指代调用该方法的对象实例。
使用 with 语句时,代码变得更加短且易读:
没有用 with 之前
x = obj.fun1(“a”); y = obj.fun2(“b”);
用 with 之后,就变成:
with(obj) { x=fun1(“a”); y=fun2(“b”); }
4. for in
在 javascript 中可以使用 for in 语句遍历对象中所有属性和方法。例如下面的代码就遍历了 test1 对象的属性和方法,如果是属性则输出属性值,如果是方法则执行方法。
for(p in t) { if(typeof(t[p])==”function”) { t[p](); }else { alert(t[p]); } }
二、 javascript 面向对象编程实现
对比 java 中面向对象编程中继承,以及封装,多态等常见概念,进行总结。
1. 类的声明
首先来看下类的实现,前面已经使用了一种声明类的方法。
function test1() { this.prop1 = “prop1”; this.prop2 =”prop2”; this.fun1 = function() { …… } }
上面代码声明了两个公有属性,和一个方法。大家都知道类里除了公有成员还可能还有一些私有成员变量,但是 javascript 并没有提供相应的机制来定义私有成员变量,不过利用一些 javascript 的小技巧就可以实现私有成员变量。如下:
function test1 () { var prop3 = “test”; this.prop1 = “prop1”; this.prop2 =”prop2”; this.fun1 = function() { …… } } 上面代码通过 var 关键字声明了一个局部变量 prop3 ,其作用域是 test1 类定义的内部,这样就实现了变量私有化。 另外在 javascript 中可以通过下面的方式声明静态属性和静态方法。 < script LANGUAGE =" JavaScript " > function test ( n ) { } test . staticProp = " static prop test!" ; test . staticMechod = function () { alert ( "adfadfd" ); } alert ( test . staticProp ); test . staticMechod (); </ script >
实际上没有感觉到 javascript 中静态的必要性(不像 java ),也许是我对书本理解的不够,或者是应用太少。如果有读者朋友,有不同认识,欢迎发表看法,大家交流。
如果要声明一个类的实例属性或方法,可以使用 javascript 中对象的 prototype 属性。例如:
test1.prototype.prop1 = “prop1”; test1.prototype.method1 = function(){}
利用 prototype 属性,可以实现另外一种类的声明方式:
< script LANGUAGE =" JavaScript " > function test () {} test . prototype = { p1 : "p1" , p2 : "p2" , f1 : function () { alert ( "f1" ); } } var te = new test (); te . f1 (); </ script >
上面使用 {} 的方式声明了一个匿名对象,大括号内用逗号将属性与值的列表分隔开。可以看到,采用 prototype 的方式声明类,代码更加简洁明了。因此这种方式在很多AJAX 框架中得到广泛应用。
2. 继承
javascript 本身并没有提供继承,那么如何实现类的继承呢?最直接大方法是复制原方法,然后在里面加入新成员。但这样做实在是落后,因为当原类变化,新继承的类还要手动变化,容易出错。而下面这种用 for in 控制的复制就不那么容易出错了。
function test1() { for(p in test.prototype) { test1.prototype[p] = test.prototype[p]; } test1.prototype.newmethod = function() { alert(“newfunction”); } }
3. 多态
多态的是实现可以采用和继承类似的方法。首先定义一个抽象类,其中可以调用一些虚方法,虚方法在抽象类中没有定义,而是通过其具体实现类来实现的。
< script LANGUAGE =" JavaScript " > // 一个继承方法 Object . extend = function ( destination , source ) { for ( pro in source ) { destination [ pro ] = source [ pro ]; } return destination ; } // 一个基类 function base (){} base . prototype = { f1 : function () { this . oninit (); } } // 扩展1 function test1 () { } test1 . prototype = Object . extend ( { prop : "prop" , oninit : function () { alert ( this . prop ); } }, base . prototype ); // 扩展2 function test2 () { } test2 . prototype = Object . extend ( { prop2 : "prop2" , oninit : function () { alert ( this . prop2 ); } }, base . prototype ); // 测试 var t1 = new test1 (); t1 . f1 (); var t2 = new test2 (); t2 . f1 (); </ script >
相关文章推荐
- javascript 面向对象特性与编程实现
- javascript 面向对象特性与编程实现
- javascript 面向对象特性与编程实现
- Javascript面向对象特性实现封装、继承、接口详细案例——进级高手篇
- Javascript面向对象特性实现(封装、继承、接口)
- 本文是笔者根据数据库编程经验,利用C++语言的模板、继承、授权、多态等面向对象特性,借鉴命令模式,实现了对象在关系数据中的存储,降低应用系统与数据库之间的耦合,提高开发效率。
- Javascript 面向对象机制的实现
- 【译】不用构造函数(Constructor)也能实现JavaScript的面向对象
- JavaScript实现面向对象中的类
- javascript面向对象实现方法(类的继承与多态)
- JavaScript学习总结(九)——Javascript面向(基于)对象编程
- JavaScript学习总结(九)——Javascript面向(基于)对象编程
- JavaScript面向对象特性
- Javascript基础与面向对象基础~第一讲 啥叫编程,啥叫程序员
- 面向面试编程——javascript对象的几种创建方式
- 面向对象在JavaScript中的接口实现
- javascript进阶——面向对象特性
- js入门三JavaScript 面向对象实现
- Javascript高级程序设计第二版第六章--面向对象程序设计(Object-Oriented Programming)简称OOP编程--笔记