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 //重写超类的方法 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.其它继承模式
原型式继承、寄生式继承、寄生组合式继承