1.原型链 (问题:原型属性会被所有实例共享)
//利用原型让一个引用类型继承另一个引用类型的属性和方法
//蹦使用对象字面量创建原型方法,否则会重写原型链
function SuperType(){
this.property = true;
}
SuperType.prototype.getSuperValue = function(){
return this.property;
};
function SubType(){
this.subproperty = false;
}
//inherit from SuperType
SubType.prototype = new SuperType();
SubType.prototype.getSubValue = function (){
return this.subproperty;
};
var instance = new SubType();
console.log(instance.getSuperValue()); //true
console.log(instance.getSubValue()); //true
console.log(instance instanceof Object); //true
console.log(instance instanceof SuperType); //true
console.log(instance instanceof SubType); //true
console.log(Object.prototype.isPrototypeOf(instance)); //true
console.log(SuperType.prototype.isPrototypeOf(instance)); //true
console.log(SubType.prototype.isPrototypeOf(instance)); //true
2.借用构造函数 (解决原型属性会被所有实例共享 问题:函数无法复用)
//借用构造函数 (解决原型属性会被所有实例共享 问题:函数无法复用)
function SuperType(){
this.colors = ["red", "blue", "green"];
}
function SubType(){
//inherit from SuperType 重点
SuperType.call(this);
}
var instance1 = new SubType();
instance1.colors.push("black");
console.log(instance1.colors); //"red,blue,green,black"
var instance2 = new SubType();
console.log(instance2.colors); //"red,blue,green"
3.组合式继承 //调用两次SuperType的构造函数
//组合式继承 //调用两次SuperType的构造函数
function SuperType(name){
this.name = name;
this.colors = ["yellow","red"];
}
SuperType.prototype.sayName = function () {
console.log(this.name);
}
function SubType(name){
//inherit from SuperType passing in an argument
//可以接收参数,只接收superType中定义的参数及参数个数,如name
SuperType.call(this, "Nicholas"); //调用SuperType的构造函数
//解决同一个subtype实例共享colors属性的问题
// SuperType.call(this);
//instance property
this.age = 29;
}
//继承方法
SubType.prototype = new SuperType(); //调用SuperType的构造函数
SubType.prototype.sayHi = function () {
console.log("hi");
}
var instance = new SubType();
instance.colors.push("blue");
var instance2= new SubType();
var supinstance = new SuperType("super");
console.log(instance.name); //"Nicholas";
console.log(instance.colors); //["yellow", "red", "blue"]
console.log(instance2.colors); //["yellow", "red"]
console.log(supinstance.colors); // ["yellow", "red"]
console.log(instance.age); //29
4.原型式继承
//原型式继承
function object(o) {
function F() {
}
F.prototype = o;
return new F();
}
var person = {
name:'Tom',
friends:['a','b','c']
};
var ooperson = object(person);
ooperson.name= 'Jony';
ooperson.friends.push("d");
var o2person = object(person);
o2person.name= 'Jony';
o2person.friends.push("e");
console.log(o2person.friends);
console.log(o2person.name);
5.寄生式继承
//寄生式继承
function createobject(o) {
var clone = object(o)
clone.sayHi = function () {
console.log("hi");
};
return clone;
}
var person = {
name:'Tom',
friends:['a','b','c']
};
var createperson = createobject(person);
createperson.sayHi();
6.寄生组合式继承 只调用了一次SuperType的构造函数
//寄生组合式继承 只调用了一次SuperType的构造函数
function inheritPrototype(SuperType,SubType) {
var o = object(SuperType.prototype); //创建对象
o.prototype.constructor = SubType; //增强对象
SubType.prototype = o; //指定对象
}
function SuperType(name){
this.name = name;
this.colors = ["yellow","red"];
}
SuperType.prototype.sayName = function () {
console.log(this.name);
}
function SubType(name,age){
SuperType.call(this,name);//调用SuperType的构造函数
//instance property
this.age = age;
}
//继承方法
inheritPrototype(SuperType,SubType);
SubType.prototype.sayHi = function () {
console.log("hi");
}
var instance = new SubType();
instance.colors.push("blue");
var instance2= new SubType();
var supinstance = new SuperType("super");