原型链
function SuperType() { this.name ="viven"; } SuperType.prototype.getSuperValue = function () { return this.name; } var b = new SuperType(); function subType() { this.anotherName="kevin"; } subType.prototype.getSuperValue = function () { return this.anotherName; } subType.prototype =new SuperType(); var instance = new subType(); console.log(instance.getSuperValue()) //viven
因为subType是SuperType的实例,所以,subType的prototype已经指向了SuperType的原型。 所以打印出来的是viven
如果在这之前先实例化instance,则instance继承的还是subType没有指向SuperTyoee的原型之前的实例:那么打印的是Kevin
function SuperType() { this.name ="viven"; } SuperType.prototype.getSuperValue = function () { return this.name; } var b = new SuperType(); function subType() { this.anotherName="kevin"; } subType.prototype.getSuperValue = function () { return this.anotherName; } var instance = new subType(); subType.prototype =new SuperType(); console.log(instance.getSuperValue()) //Kevin
确定原型和实例之间的关系instanceof
function SuperType() { this.name ="viven"; } SuperType.prototype.getSuperValue = function () { return this.name; } var b = new SuperType(); function subType() { this.anotherName="kevin"; } subType.prototype.getSuperValue = function () { return this.anotherName; } var instance = new subType(); subType.prototype =new SuperType(); console.log(instance instanceof Object) //true console.log(instance instanceof subType) //false console.log(instance instanceof SuperType) //false
在subType的原型指向superType之前实例化instance,那么 instance实例的原型只有Object,因为任何对象最终都是指向Object
如果是之后呢
function SuperType() { this.name ="viven"; } SuperType.prototype.getSuperValue = function () { return this.name; } var b = new SuperType(); function subType() { this.anotherName="kevin"; } subType.prototype.getSuperValue = function () { return this.anotherName; } subType.prototype =new SuperType(); var instance = new subType(); console.log(instance instanceof Object) //true console.log(instance instanceof subType) //true console.log(instance instanceof SuperType) //true
function superType() { this.colors = ["red","green","blue"]; } function SubType() { } SubType.prototype = new superType(); var instance = new SubType(); instance.colors.push("white"); console.log(instance.colors); //["red", "green", "blue", "white"] var instance2 = new SubType(); console.log(instance2.colors)//["red", "green", "blue", "white"]
一般很少会单独使用原型链
2.借用构造函数
利用call 在新的SubType对象上执行superType()函数中的所有对象方法
function superType() { this.colors = ["red","green","blue"]; } function SubType() { superType.call(this); } var instance = new SubType(); instance.colors.push("white"); console.log(instance.colors); //["red", "green", "blue", "white"] var instance2 = new SubType(); console.log(instance2.colors)//["red", "green", "blue"]
1.传递参数
可以在子类型构造函数中向超类型构造函数传递参数
function SuperType(name) { this.name = name; } function SubType() { //继承SuperType,同时传递参数 SuperType.call(this,"viven") //定义实例属性 this.age = 19; } var instance = new SubType(); console.log(instance.name); //viven console.log(instance.age); //19
在调用超类型构造函数后,在添加子类型中的属性,是为了防止SuperType构造函数改写。
function SuperType(name,age) { this.name = name; this.age = age; } function SubType() { //定义实例属性 this.age = 19; //继承SuperType,同时传递参数 SuperType.call(this,"viven",20) } var instance = new SubType(); console.log(instance.name); //viven console.log(instance.age); //20
3.组合继承
function SuperType(name) { this.name = name; this.color =["red","green","blue"]; } SuperType.prototype.sayName = function () { console.log(this.name); } function SubType(name,age) { //继承SuperType属性,同时传递参数 SuperType.call(this,name); //定义实例属性 this.age = age; } //继承方法 SubType.prototype = new SuperType(); //定义实例方法 SubType.prototype.sayAge = function () { console.log(this.age) } var instance = new SubType("viven",29); instance.color.push("white"); instance.sayName(); //viven instance.sayAge(); //29 console.log(instance.color); var instance2 = new SubType("Kevin",20); instance2.sayName(); //Kevin instance2.sayAge(); //20 console.log(instance2.color);
4.寄生组合式继承
function inheritPrototype(subType,superType) { var prototype = Object(superType.prototype); prototype.constructor = subType; subType.prototype =prototype; } function SuperType(name) { this.name = name; this.color =["red","green","blue"]; } SuperType.prototype.sayName = function () { console.log(this.name); } function SubType(name,age) { //继承SuperType属性,同时传递参数 SuperType.call(this,name); //定义实例属性 this.age = age; } inheritPrototype(SubType,SuperType); //定义实例方法 SubType.prototype.sayAge = function () { console.log(this.age) } var instance = new SubType("viven",29); instance.color.push("white"); instance.sayName(); //viven instance.sayAge(); //29 console.log(instance.color); var instance2 = new SubType("Kevin",20); instance2.sayName(); //Kevin instance2.sayAge(); //20 console.log(instance2.color);