Reputation: 91
I'm trying to create a simple object with a method that changes the value of one of the keys. I want to initialize the isFoodWarm key to false, output the value, change it to true, then output it again. My expected output is false and then true, as the method should change it to true, but I am getting an error. I tried removing the parentheses from myBreakfast.heat();, which got rid of the error, but then it didn't successfully change the value. What am I doing wrong? Here is my code.
function Breakfast(food, drink, isFoodWarm) {
this.food = food,
this.drink = drink,
this.isFoodWarm = isFoodWarm,
heat = function() {
if (isFoodWarm === false){
isFoodWarm = true;
console.log("your food is now warm");
}
}
}
var myBreakfast = new Breakfast("english muffin", "OJ", "false");
console.log(myBreakfast.isFoodWarm);
myBreakfast.heat();
console.log(myBreakfast.isFoodWarm);
I get the following console output:
false
Uncaught TypeError: myBreakfast.heat is not a function
Upvotes: -1
Views: 55
Reputation: 1704
Your heat
function is not bound to object of instance of Breakfast
class. You can easily fix it by adding heat
as property to this
inside Breakfast
class constructor:
function Breakfast(food, drink, isFoodWarm) {
this.food = food,
this.drink = drink,
this.isFoodWarm = isFoodWarm,
this.heat = function() {
if (this.isFoodWarm === false){
this.isFoodWarm = true;
console.log("your food is now warm");
}
}
}
UPDATE: Also change isFoodWarm
in function heat
to this.isFoodWarm
.
Upvotes: 0
Reputation: 31910
You need to attach heat method to constructor BreakFast
too. And also isFoodWarm
is a property so it must be accessed using this.isFoodWarm
inside the heat
method.
this.heat=function() {
if (this.isFoodWarm === false){
this.isFoodWarm = true;
console.log("your food is now warm");
}
}
Explanation : Without this
operator heat method gets attached to global object, so when you call myBreakfast.heat
it gives an Uncaught TypeError
because it is defined under window.heat
.
Note : when you need to pass a boolean then don't wrap it inside quotes as it will change your boolean to string which will behave like true.
so change your constructor call to
new Breakfast("english muffin", "OJ", false); \\remove double quotes around false
Demo
function Breakfast(food, drink, isFoodWarm) {
this.food = food,
this.drink = drink,
this.isFoodWarm = isFoodWarm,
this.heat = function() {
if (this.isFoodWarm === false){
this.isFoodWarm = true;
console.log("your food is now warm");
}
}
}
var myBreakfast = new Breakfast("english muffin", "OJ", false);
console.log(myBreakfast.isFoodWarm);
myBreakfast.heat();
console.log(myBreakfast.isFoodWarm);
Upvotes: 1