Hey, guys. I’m making a Shopping List app (modified version of Watch and Code course to-do app), and I’m stuck. Console tells me that shoppingList is not defined although it IS defined right on line 1. Therefore I can’t access the functions in the variable like displayShoppingList, addToShoppingList etc. My error is probably very simple but I can’t locate it, could you help me out pls? Also any comments on the existing code are VERY much welcome.
Code’s below:
var shoppingList ={
list: [‘milk’,‘beer’,‘sugar’],
displayShoppingList : function(){
if (this.list.length>0) {
for (var x=0;x<list.length;x++){
if (this.list[x].isBought===true) {
console.log(’(x)’+this.list[x].item);
}
else {
console.log (’( )’+this.list[x].item);
}
}
}
else {
console.log (‘Your shopping list is empty’);
}
},
addToShoppingList : function (item){
this.list.push({
item: item,
isBought: false,
itemCounter: 1
});
this.displayShoppingList();
},
changeShoppingList : function(place, newItem) {
this.list[place].item=newItem;
this.displayShoppingList();
},
makeItemBought : function(place){
this.list[place].isBought=!this.list[place].isBought;
this.displayShoppingList();
},
deleteFromShoppingList : function(place){
this.list.splice(place, 1);
this.displayShoppingList();
},
toggleAllItems : function(){
for (var y=0;y<list.length;y++) {
this.list[y].isBought = true;
}
this.displayShoppingList();
},
};
//add multiple items at the same time - divide them by “,” and push one by one(?)
//counter on each item - add ‘counter’ property to item/isBought, increase by one (tap) or manually by counter (how? - figure out!)
//swipe movements and mobile devices adaptation (read docs)
Done it, but when I try, for example, “shoppingList.displayShoppingList()”, the console still gives me “VM4933:1 Uncaught ReferenceError: shoppingList is not defined
at :1:1”
As it isn’t able to see the very first variable for some reason. Do you have any ideas why it’s happening?
The thing is I am using Plunker for this project. I’ve checked now, when I place “shoppingList.displayShoppingList()” after the code it works, but when I call it from Chrome console - it gives the error I’ve told you about. It should work like this or am I doing a mistake?
Code:
var shoppingList = {
list: [{
item: 'milk',
isBought: false,
itemCounter: 1
},
{
item: 'beer',
isBought: false,
itemCounter: 1
},
{
item: 'sugar',
isBought: false,
itemCounter: 1
}
],
displayShoppingList: function() {
if (this.list.length > 0) {
for (var x = 0; x < this.list.length; x++) {
if (this.list[x].isBought === true) {
console.log('(x)' + this.list[x].item);
} else {
console.log('( )' + this.list[x].item);
}
}
} else {
console.log('Your shopping list is empty');
}
},
addToShoppingList: function(item) {
this.list.push({
item: item,
isBought: false,
itemCounter: 1
});
this.displayShoppingList();
},
changeShoppingList: function(place, newItem) {
this.list[place].item = newItem;
this.displayShoppingList();
},
makeItemBought: function(place) {
this.list[place].isBought = !this.list[place].isBought;
this.displayShoppingList();
},
deleteFromShoppingList: function(place) {
this.list.splice(place, 1);
this.displayShoppingList();
},
toggleAllItems: function() {
for (var y = 0; y < this.list.length; y++) {
this.list[y].isBought = true;
}
this.displayShoppingList();
},
};
shoppingList.displayShoppingList() // this works, but if I comment out this line and call it from Chrome console it gives the error