一、原型链继承
function SuperType(){ this.property = true; } SuperType.prototype.getSuperValue = function(){ return this.property; } function SubType(){ this.subproperty = false;//SubType有了一个属性subproperty,值为false } // 核心 SubType.prototype = new SuperType(); //SubType继承了SuperType的属性property,值为true, //还继承了SuperType在prototype对象中定义的getSuperValue方法 SubType.prototype.getSubValue = function(){ return this.subproperty;//SubType又有了一个在prototype对象中定义的getSubValue方法 } //自此,SubType拥有4个属性,其中两个是真正的属性,另两个是方法。 //知识点1,重新父类的同名方法。会覆盖父类的同名方法。 //SubType.prototype.getSuperValue = function(){return false;} //知识点2,原型链实现继承时,不能使用对象字面量创建原型方法。因为这样做会重写原型链 SubType.prototype = { saySubValue : function(){return this.subproperty;}, sayOtherValue : function(){return false;} }; //批注:运行上面代码时,会使SubType.prototype = new SuperType();无效 //console.log(SuperType); //console.log(SubType); var i = new SubType(); //创建一个实例 //alert(i.getSuperValue()); //alert( i instanceof Object); //alert( i instanceof SuperType); //alert( i instanceof SubType); //该实例是三个对象的实例,他们是继承关系。 //alert(Object.prototype.isPrototypeOf(i)); //alert(SuperType.prototype.isPrototypeOf(i)); //alert(SubType.prototype.isPrototypeOf(i)); alert(i.getSuperValue()); 4,obj4 //1,原型链的问题 function SuperType(){ this.colors = ['red','blue','green']; } function SubType(){ } SubType.prototype = new SuperType(); var i = new SubType(); i.colors.push('black'); alert(i.colors); var j = new SubType(); alert(j.colors);//4。原因是j的prototype与i的一样。里面包含着父类的属性和prototype。
二、借用构造函数
function SuperType(){ this.colors = ["red","blue","green"]; } function SubType(){ SuperType.call(this);//call相当于设置函数体内this对象的值。 } var i = new SubType(); i.colors.push("black"); alert(i.colors); //"red","blue","green","black" var i2 = new SubType(); alert(i2.colors); //"red","blue","green" //批注:通过call借调了父类的构造函数,实际上是在子类创建实例时调用了父类的构造函数。 //1,传递参数 function SuperType(name){ this.name = name; } function SubType(){ SuperType.call(this, "Nicholas"); this.age = 29; } var i = new SubType(); alert(i.name); alert(i.age); //2,问题:方法都在构造函数中,无法复用。
三、组合继承
function SuperType(name){ this.name = name; this.colors = ["red","blue","green"]; } SuperType.prototype.sayName = function(){ alert(this.name); }; function SubType(name,age){ SuperType.call(this,name); this.age = age; } SubType.prototype = new SuperType(); SubType.prototype.sayAge = function(){ alert(this.age); } var i = new SubType("nich",29); i.colors.push("black"); //alert(i.colors);//"red","blue","green","black" //i.sayName(); //"nich" //i.sayAge(); //29 var i2 = new SubType("greg",27); //alert(i2.colors);//"red","blue","green" //i2.sayName(); //"greg" //i2.sayAge(); //27 alert(i.name == i2.name); //false alert(i.age == i2.age); //false alert(i.colors == i2.colors);//false alert(i.sayName == i2.sayName);//true 原因:sayName也是原型对象中定义的方法 alert(i.sayAge == i2.sayAge); //true
//批注:该方法在实际中是使用最多的一种。
如果您觉得本文的内容对您的学习有所帮助,您可以微信: