JavaScript 继承和数组

Question

我这样定义我的类:

function Employee () {
    this.name = "";
    this.val = new Array();
}

function WorkerBee () {
    this.beeQueen = "lola";

    this.setVal = function(val) {
        this.val.push(val);
    };
}
WorkerBee.prototype = new Employee;


function SalesPerson () {
    this.dept = "development";  
}
SalesPerson.prototype = new WorkerBee;

function Engineer () {
    this.dept = "R&D";
}
Engineer.prototype = new WorkerBee;

问题:我创建的所有对象共享同一个 val 数组:

var mark = new WorkerBee;
mark.name = "Mark";
mark.setVal('00000')

var louis = new SalesPerson;
louis.name = "Louis";
louis.setVal('11111')

var ricky = new SalesPerson;
ricky.name = "Ricky";
ricky.setVal('33333')

var john = new Engineer;
john.name = "John";
john.setVal('55555');

这个:

html += "<br /><br />Name: " + mark.name;
html += "<br />Val: " + mark.val;

html += "<br /><br />Name: " + louis.name;
html += "<br />Val: " + louis.val;

html += "<br /><br />Name: " + ricky.name;
html += "<br />Val: " + ricky.val;

html += "<br /><br />Name: " + john.name;
html += "<br />Val: " + john.val;

显示:

Name: Mark
Val: 00000,11111,33333,55555

Name: Louis
Val: 00000,11111,33333,55555

Name: Ricky
Val: 00000,11111,33333,55555

Name: John
Val: 00000,11111,33333,55555

我读了http://yehudakatz.com/2011/08/12/understanding-prototypes-in-javascript/和 http://javascriptweblog.wordpress.com/2010/06/07/understanding-javascript-prototypes/但我还是很困惑!

当我使用字符串而不是数组时，效果很好(我想是因为对字符串的引用被覆盖了)但是如何使用数组呢？

所以我可以:

姓名:马克值:00000

姓名:路易斯值:11111

姓名:瑞奇值:33333

姓名:约翰值:55555

Answer 1

您需要apply “继承”构造函数中的“父”构造函数:

function WorkerBee () {
    Employee.apply(this);
    /*...*/
}
WorkerBee.prototype = new Employee();

对“继承的”构造函数所有做同样的事情:

function SalesPerson () {
    WorkerBee.apply(this);
    /*...*/
}
SalesPerson.prototype = new WorkerBee();

function Engineer () {
    WorkerBee.apply(this);
    /*...*/
}
Engineer.prototype = new WorkerBee();

See the example on jsfiddle .

就像@austincheney 指出的那样，JavaScript 没有“类”——只有函数(对象)、构造函数(函数)和对象。

---

JavaScript 使用 prototypal inheritance .这意味着当您尝试访问不存在的对象的属性(或函数)时，它将委托(delegate)给原型(prototype)对象。

考虑:

var isaacNewton = {
    name: 'Isaac Newton'
};

function Scientist() {}
Scientist.prototype = isaacNewton;

var neilDeGrasseTyson = new Scientist();

console.log(neilDeGrasseTyson.name);

isaacNewton.name = 'Sir Isaac Newton';

console.log(neilDeGrasseTyson.name);

这里的输出是:

Isaac Newton
Sir Isaac Newton

对象 neilDeGrasseTyson 没有继承 name 属性。它根本没有。由于它没有属性 name，当我们尝试访问 name 时，neilDeGrasseTyson 对象将委托(delegate)给原型(prototype)对象 Scientist。 prototype，返回Scientist.prototype.name的值，即isaacNewton.name。

在您的代码中，对象mark、louis、ricky 和john没有属性 val。所有这些对 setVal 的调用最终都会操纵 WorkerBee.prototype.val，因为这些对象都没有自己的 val 属性。通过向它们应用 Employee 构造函数，您向它们引入了 Employee 的属性，因此它们不必委托(delegate)。

为了进一步说明这一点，另一种解决方案是将方法 setVal 放在 Employee 中，并为每个“继承”构造函数提供一个 this .val 属性:http://jsfiddle.net/FDCXF/1/