当前位置:编程学习 > JAVA >>

javascript学习笔记(十)对象--继承

1.原型链
//很少单独使用
  View Code
 
 1 //定义 SuperClass类,有一个属性property和一个方法getSuperValue
 2 function SuperClass() {
 3     this.property = true;
 4 }
 5 SuperClass.prototype.getSuperValue = function() {
 6     return this.property;
 7 }
 8
 9 //定义SubClass类,有一个属性subproperty和后来添加的一个方法getSubValue
10 function SubClass() {
11     this.subproperty = false;
12 }
13
14 //SubClass类继承SuperClass类
15 SubClass.prototype = new SuperClass();
16
17 //SubClass类添加一个方法getSubValue
18 SubClass.prototype.getSubValue = function() {
19     return this.subproperty;
20 }
21
22 //创建SubClass类的实例
23 var instance = new SubClass();
24 alert(instance.getSuperValue());
 
2. 确定原型与实例的关系
第一种方式用 instanceof 操作符,用来测试实例和原型链中出现过的构造函数
1 alert(instance instanceof Object);                //true ,instance是Object的实例吗?
2 alert(instance instanceof SuperClass);        //true ,instance是SuperClass的实例吗?
3 alert(instance instanceof SubClass);        //true,instance是SubClass的实例吗?
第二种方式用 isPrototypeOf()方法,测试原型链中出现的原型
1 alert(Object.prototype.isPrototypeOf(instance));    //true
2 alert(SuperClass.prototype.isPrototypeOf(instance));    //true
3 alert(SubClass.prototype.isPrototypeOf(instance));    //true
3. 用原型链继承定义方法时的注意点
定义方法是的顺序:
  View Code
 
 1 function SuperClass() {
 2     this.property = true;
 3 }
 4 SuperClass.prototype.getSuperValue = function() {
 5     return this.property;
 6 }
 7
 8 function SubClass() {
 9     this.subproperty = false;
10 }
11
12 //SubClass继承SuperClass
13 SubClass.prototype = new SuperClass();                    //这个要先写,新添加的方法和重写超类的方法要写在后面,否则重写的超类方法将永远无法调用
14
15 //添加新方法
16 SubClass.prototype.getSubValue = function() {
17     return this.subproperty;
18 }
19 //重写超类的方法 www.zzzyk.com 
20 SubClass.prototype.getSuperValue = function() {
21     return false;
22 }
23
24 var instance = new SubClass();
25 alert(instance.getSuperValue());        //fales,这里SubClass的实例调用了SubClass的getSuperValue()方法,而屏蔽了SuperClass的getSuperValue()方法,
26                                                     //使用SuperClass的方法会调用SuperClass的getSuperValue()方法
 
原型链继承的缺点:1)共享超类中的属性,2)在创建子类时不能向超类的构造函数传递参数。所有很少单独使用原型链
4.借用构造函数
//很少单独使用

优点:可以向超类传递参数 。缺点:函数无法复用,所有类都要使用构造函数模式
  View Code
 
 1 function SuperClass(name) {
 2     this.name = name;
 3 }
 4 function SubClass(){
 5     SuperClass.call(this,"RuiLiang");        //继承了SuperClass,同时向SuperClass传递了参数
 6     this.age = 29;                                //实例属性
 7 }
 8
 9 var instance = new SubClass();
10 alert(instance.name);        //RuiLiang
11 alert(instance.age);            //29
 
6.组合继承
//最常用的继承模式
  View Code
 
 1 //创建SuperClass
 2 function SuperClass(name) {
 3     this.name = name;
 4     this.colors = ["red","blue","green"];
 5 }
 6 SuperClass.prototype.sayName = function() {
 7     alert(this.name);
 8 }
 9
10 ////创建SubClass
11 function SubClass(name,age) {
12     SuperClass.call(this,name);        //继承属性
13     this.age = age;                            //自己的属性
14 }
15
16 SubClass.prototype = new SuperClass();            //继承方法
17 SubClass.prototype.sayAge = function() {            //SubClass添加新方法
18     alert(this.age);
19 };
20
21 //使用
22 var instance1 = new SubClass("RuiLiang",30);
23 instance1.colors.push("black");
24 alert(instance1.colors);                    //"red,blue,green,black"
25 instance1.sayName();                        //"RuiLiang"
26 instance1.sayAge();                        //30
27
28 var instance2 = new SubClass("XuZuNan",26);
29 alert(instance2.colors);                    //"red,blue,green"
30 instance2.sayName();                        //"RuiLiang"
31 instance2.sayAge();                        //30
 
7.其它继承模式
原型式继承、寄生式继承、寄生组合式继承

 

 

摘自 晴天漫步

补充:web前端 , JavaScript ,
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,