Javascript子类化

Question

我希望这会在控制台中显示：“ 2”和“ 11”。 但是相反，它给了我“ 2”和“ 2”。 为什么未覆盖publicFunc2 ？ http://jsfiddle.net/17b5ytmq/1/ 。 我想我不了解有关Java子类化的知识。

function MyClass() {
    var self = this;
    this._protectedArr = [1];
    this.publicFunc = function() {
        this._protectedArr.forEach(function(element, index, array) {
            console.log(element + self.publicFunc2());
        });
    }
    this.publicFunc2 = function () {
        return 1;
    }
}

function MyClassChild() {
    this.publicFunc2 = function () {
        return 10;
    }
}

var myClass = new MyClass();
myClass.publicFunc();

MyClassChild.prototype = myClass;
var myClassChild = new MyClassChild()
myClassChild.publicFunc();

Answer 1

您应该继承原型而不是实例：

MyClassChild.prototype = Object.create(MyClass.prototype);

你也应该调用构造函数来真正继承所有的类

function MyClassChild() {
    MyClass.call(this);

    this.publicFunc2 = function () {
        return 10;
    }
}

MyClassChild.prototype = Object.create(MyClass.prototype);

最后， this关键字在方法中使用时是对当前实例的动态引用。

当你将this给一个变量您创建的静态引用，可以像任何其他对象的引用可以使用当前实例。

这是一个说明性示例：

function MyClass() {
    var self1 = this;
    this.id = 'MyClass';

    this.publicFunc = function() {
        var self2 = this;
        asyncAction(function () {
            // self1 - MyClass
            // self2 - MyClass or MyClassChild - depends on the calling object
        });

        return self1.id + ' - ' + this.id;
    };

    this.publicFunc2 = function () {
        return 1;
    };
}

function MyClassChild() {
    MyClass.call(this);
    this.id = 'MyClassChild';

    this.publicFunc2 = function () {
        return 10;
    }
}
MyClassChild.prototype = Object.create(MyClass.prototype);

var myClass = new MyClass();
var myClassChild = new MyClassChild();

myClass.publicFunc(); // MyClass - MyClass
myClassChild.publicFunc(); // MyClass - MyClassChild

myClass.publicFunc2(); // 1
myClassChild.publicFunc2(); // 10