In the following code, I have two Book Collections. One collection has "Moby Dick," while the other collection has "The Firm." However, when I look at the second collection, it also has Moby Dick. How do I create Books that do not share the same data?
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"]
I ended up going with this:
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());
Use a per-instance value with this
:
function Books () {
this.stuff = [];
}
And then in the collection:
this.get = function () {
return this.stuff;
};
Currently only one stuff
array is created when you set the prototype of Books. All the inherited getters and setters then refer to that one variable.
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"]
You have a lot of structural issues with your code. Your methods in Collection should also be prototyped and they currently are not. If you dont prototype the methods trying to get access to "stuff" you endup with multiple functions referencing the exact same property instead of creating their own instance of that property. Follow this structure instead:
Main Collection Class
function Collection () {
this.stuff = [];
};
Collection.prototype.get = function(){
return this.stuff;
};
Collection.prototype.add = function(item){
this.stuff.push(item);
}
Main Books Class Inherits From Collection
function Books () {
Collection.call(this);
};
Books.prototype = new Collection();
Books.prototype.constructor = Books;
Using Your Books Class
var myBooks = new Books();
myBooks.add("Moby Dick");
var yourBooks = new Books();
yourBooks.add("The Firm");
console.log(yourBooks.get());
JSFiddle with working example:
Source where you can get further details regarding Javascript prototype:
Let me know bellow if you have any questions about the code itself or this change in structure.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.