2

在下面的代码中,我有两个 Book Collections。一个系列有“Moby Dick”,而另一个系列有“The Firm”。然而,当我看第二个系列时,它也有 Moby Dick。如何创建不共享相同数据的图书?

function Collection () {
    var stuff = [];
    this.get = function () {
        return stuff;
    };
    this.add = function (item) {
        stuff.push(item);
    };
}
function Books () {}
Books.prototype = new Collection ();

var myBooks = new Books();
myBooks.add("Moby Dick");

var yourBooks = new Books();
yourBooks.add("The Firm");

console.log(yourBooks.get()); // ["Moby Dick", "The Firm"]

我最终选择了这个:

function Collection () {
    var stuff = [];
    this.get = function(){
        return stuff;
    };
    this.add = function(item){
        stuff.push(item);
    };
}
function Books () {
    Collection.call(this);
};

Books.prototype = new Collection();

Books.prototype.constructor = Books;

var myBooks = new Books();
myBooks.add("Moby Dick");

var yourBooks = new Books();
yourBooks.add("The Firm");

console.log(myBooks.get());
4

2 回答 2

6

使用每个实例的值this

function Books () {
    this.stuff = [];
}

然后在集合中:

this.get = function () {
    return this.stuff;
};

目前stuff在设置 Books 的原型时只创建一个数组。然后,所有继承的 getter 和 setter 都引用那个变量。


完整代码

function Collection () {
    this.get = function () {
        return this.stuff;
    };
    this.add = function (item) {
        this.stuff.push(item);
    };
}
function Books () {
    this.stuff = [];
}

Books.prototype = new Collection ();

var myBooks = new Books();
myBooks.add("Moby Dick");

var yourBooks = new Books();
yourBooks.add("The Firm");

console.log(myBooks.get()); // ["Moby Dick"]
console.log(yourBooks.get()); // ["The Firm"]
于 2013-10-08T19:21:04.717 回答
0

您的代码存在很多结构性问题。您在 Collection 中的方法也应该是原型的,而它们目前不是。如果您不对尝试访问“东西”的方法进行原型设计,那么您最终会得到多个引用完全相同属性的函数,而不是创建自己的该属性实例。请遵循以下结构:

集合

function Collection () {
    this.stuff = [];
};

Collection.prototype.get = function(){
    return this.stuff;
};

Collection.prototype.add = function(item){
    this.stuff.push(item);
}

主要书籍类继承自集合

function Books () {
    Collection.call(this);
};

Books.prototype = new Collection();
Books.prototype.constructor = Books;

使用你的书籍

var myBooks = new Books();
myBooks.add("Moby Dick");

var yourBooks = new Books();
yourBooks.add("The Firm");

console.log(yourBooks.get());

JSFiddle 与工作示例:

JSFiddle

您可以在其中获得有关 Javascript 原型的更多详细信息的来源:

Mozilla 文档

如果您对代码本身或这种结构变化有任何疑问,请告诉我。

于 2013-10-08T19:56:03.867 回答