JavaScript面向对象设计(3)

function SuperType(){
this.colors = ["red", "blue", "green"];
this.sayHi=function(){console.log("Hi")};
}
function SubType(){
//继承了SuperTypeSuperType.call(this);
}
var instance1 = new SubType();
var instance2 = new SubType();
alert(instance1.sayHi==instance2.sayHi); //false

组合继承原型链和call方式都有缺点,但是把两者取长补短,形成组合继承。其思想非常简单,用原型链方式,对需要共享的原型属性和方法实现继承。再通过call方式借用构造函数来实现无需共享的属性的继承。这样即有了共享的属性,也有了不共享的属性。

function SuperType(name) {
    this.name = name;
    this.colors = ["red", "blue", "green"];
}
//sayName能够被共享
SuperType.prototype.sayName = function() {
    alert(this.name);
};
 
function SubType(name, age) {
    //继承属性
 call方式继承 ,name属性不会被共享
    SuperType.call(this, name);
    this.age = age;
}
 
//继承方法 原型链方式继承
SubType.prototype = new SuperType();
SubType.prototype.constructor = SubType;
SubType.prototype.sayAge = function() {
    alert(this.age);
};
var instance1 = new SubType("Nicholas", 29);
instance1.colors.push("black");
alert(instance1.colors); //"red,blue,green,black"
instance1.sayName(); //"Nicholas";
instance1.sayAge(); //29
var instance2 = new SubType("Greg", 27);
alert(instance2.colors); //"red,blue,green"
instance2.sayName(); //"Greg";
instance2.sayAge(); //27

可以看到,对于需要共享的属性、方法,采用原型链的方式继承,对于不需要的共享的,比如属性,则用call方法实现继承。这种方式是javascript中最常用的继承方式。 原型式继承 这个方式是json格式的发明人Douglas Crockford所创造。 提出了一个object()函数,可以做到这一点。

function object(o) {
  function F() {}
  F.prototype = o;
  return new F();
}

这个object()函数,借用了一个临时函数,把传入的对象作为父对象,作为临时函数的prototype属性,并返回这个临时函数的一个实例作为子对象,从而使得子对象与父对象连在一起。

var person = {
    name: "Nicholas",
friends: ["Shelby", "Court", "Van"]
};
 
var anotherPerson = object(person);
anotherPerson.name = "Greg";
 
anotherPerson.friends.push("Rob");
var yetAnotherPerson = object(person);
 
yetAnotherPerson.name = "Linda";
yetAnotherPerson.friends.push("Barbie");
 
alert(person.friends); //"Shelby,Court,Van,Rob,Barbie"

这个例子中,person对象作为父对象,把它传入到object函数中,会返回一个新的对象,该对象的原型就是person,所以它的原型中就包含一个基本类型值属性和一个引用类型值属性。这意味着person.friends 不仅属于person 所有,而且也会被anotherPerson以及yetAnotherPerson 共享。实际上,这就相当于又创建了person 对象的两个副本。

参考资料:

JavaScript高级程序设计(第3版)高清完整PDF中文+英文+源码 

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/c1954af2527bc56850352470470ecba6.html