您现在的位置:首页 >> 前端 >> 内容

关于js中使用call实现继承

时间:2017/4/20 10:32:00 点击:

  核心提示:关于js中使用call实现继承:call/apply网上有很多说明,但基本上都没有阐释它的实际运行机制,总是说将A的方法全部给了B,但是原因是什么,我还没看到有那篇文章说明过。说明之前首先必须要说先说...

关于js中使用call实现继承:call/apply网上有很多说明,但基本上都没有阐释它的实际运行机制,总是说将A的方法全部给了B,但是原因是什么,我还没看到有那篇文章说明过。说明之前首先必须要说先说明几个概念。

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

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

var objA = new ClassA("blue");
var objB = new ClassB("red", "John");
objA.sayColor();
objB.sayColor();
objB.sayName();
在ClassA(),ClassB()中我没有写return 语句,或者你写“return 2”返回基本类型时,是默认返回this的。然后this也是一个很复杂的玩意,在这里是构造函数中的this,这种情况下,this一开始是一个空对象,原型指向ClassA()的prototype属性,实例化时this.Saycolor=function(){//do sth}给this赋值。 所以objA.sayColor()可以使用。

ClassA.call(this, sColor)可以这么理解,就是把ClassA中的this,换成(this,sColor)中的this,也即是将ClassA中this替换为ClassB的this,所以实例化ClassB时其中的this,不仅仅在ClassA中被赋值了,也在ClassB中被赋值了,即this.color=sColor;this.Saycolor=function(){}。 所以objB可以调用sayColor(),因为objB==this,这个ClassA的this又在ClassB中被赋值过。

Tags:关于 于J JS S中 
作者:网络 来源:qq_3405764
  • 上一篇:vue安装详情
  • 下一篇:mac安装pkg-config