javascript - 原型(prototype)对象的数组

Question

我有一个很好的问题。我需要明白这一点

Foo = function(){
};


Foo.prototype = {
buttons: new Array(),
index:'',
add: function(value)
{
    this.buttons.push(value);
},
clear:function(){
    this.buttons=new Array();
},
count:function(){
    return(this.buttons.length);
},
setIndex:function(index){
    this.index;
},
getIndex:function(index){
    return this.index;
}
};

var A= new Foo();
var B= new Foo();

A.add('toto');
B.add('tata');

A.setIndex(8);
B.setIndex(44);

alert(A.count()+"---"+A.getIndex());

那个代码给我:“2---8”!!

所以 A.count() 返回 A.count() + B.count()。与 B.count() 相同!!

任何人都可以向我解释一下，已经有这个问题了吗？怎么做 ？我只需要数组“按钮”是唯一的，适合每个对象。

Answer 1

这不是原型(prototype)继承的工作方式，A 和 B 具有相同的原型(prototype)，这意味着它们具有相同的 buttons 数组。

在 JavaScript 中，继承是典型的，您希望每个“Foo”对象都有一个单独的按钮数组，但您要将它添加到 Foo 的原型(prototype)中，所以它是 在其所有实例之间共享。

你可以改变这个:

var Foo = function(){
};

到

Foo = function(){
   this.buttons = []; //add an empty buttons array to every foo element.
};

这将使它工作，另一种选择是首先调用 clear 方法，它将实例化一个新的 buttons 数组。

请注意，原型(prototype)继承主要是关于共享功能，而不是属性。您希望每个 Foo 实例都具有相同的功能，但每个实例都有自己的 buttons 数组。

一些可以帮助您的资源:

Here is a good tutorial about how the prototypical chain works on MDN

Here is Addy Osmani's (Google) chapter about the constructor pattern来自他的 JavaScript 模式书

关于您的代码的一些其他提示:

new Array() 语法可以简化为[]。在 setIndex 中，您实际上并没有将索引分配给任何东西。 index 最好也在 Foo 的构造函数中声明。

请注意，当您在原型(prototype)链上存在此类属性的情况下设置对象的属性时，它会在对象上创建一个新属性，而不是在原型(prototype)上修改该属性。