ECMAScript 继承机制实现

一直没明白call()，所以找个一下资料，终于呢，是理清了，简单点说呢，就俩字“继承”。

 

 

直接上代码了

 

 

function ClassA(sColor) {
    this.color = sColor;
    this.sayColor = function () {
        alert(this.color);
    };
}

 

 

• 对象冒充 （object masquerading）

function ClassB(sColor, sName) {
    this.newMethod = ClassA;
    this.newMethod(sColor);
    delete this.newMethod;

    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };
}

 

 

  原理：使 ClassA 构造函数成为 ClassB 的方法，然后调用它。ClassB 就会收到 ClassA 的构造函数中定义的属性和方法。

 

对象冒充支持多重继承

 

 

• call()

function ClassB(sColor, sName) {
    //this.newMethod = ClassA;
    //this.newMethod(color);
    //delete this.newMethod;
    ClassA.call(this, sColor);

    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };
}

 

 

一目了然

 

• apply()

apply()与call()的区别就在于第二个参数，call是直接传入参数，而apply则是参数数组。

 

 

ClassA.apply(this, new Array(sColor));

 

 如果子类父类的参数顺序一致，也可直接传arguments 。

 

 

ClassA.apply(this, arguments);

 

 

•  原型链(prototype chaining)

 

function ClassA() {
}

ClassA.prototype.color = "blue";
ClassA.prototype.sayColor = function () {
    alert(this.color);
};

function ClassB() {
}

ClassB.prototype = new ClassA();

 

直接把 ClassB 的 prototype 属性设置成 ClassA 的实例。

不能传递参数，这在原型链中是标准做法。

 

 

var objB = new ClassB();
alert(objB instanceof ClassA);	//输出 "true"
alert(objB instanceof ClassB);	//输出 "true"

 

 

• 混合

function ClassA(sColor) {
    this.color = sColor;
}

ClassA.prototype.sayColor = function () {
    alert(this.color);
};

function ClassB(sColor, sName) {
    ClassA.call(this, sColor);
    this.name = sName;
}

ClassB.prototype = new ClassA();

ClassB.prototype.sayName = function () {
    alert(this.name);
};

 怎么来的呢？

 

对象冒充必须使用构造函数方式，原型链不能带参数。那就一起用呗

 

instanceof 依然是true