This question already has answers here:
How to access the correct `this` inside a callback
(13 answers)
Closed 6 years ago.
I have a function like so in my class
showMessageSuccess(){
var that = this;
this.messageSuccess = true;
setTimeout(function(){
that.messageSuccess = false;
},3000);
}
How can I re-write this so I don't have to store a reference to 'this' in the 'that' var? If I use 'this' inside the setTimeout, the messageSuccess bool doesn't seem to change/get updated.
You need to use Arrow function ()=> ES6 feature to preserve this context within setTimeout.
// var that = this; // no need of this line
this.messageSuccess = true;
setTimeout(()=>{ // <<<---using ()=> syntax
this.messageSuccess = false;
}, 3000);
Related
This question already has answers here:
How does the "this" keyword work, and when should it be used?
(22 answers)
How to access the correct `this` inside a callback
(13 answers)
Closed 1 year ago.
let obj = {
one: function(){
this.two();
},
two: function(){
console.log("two");
}
}
let oneFunc = obj.one;
obj.one(); // two
oneFunc(); // TypeError: this.two is not a function
I have been programming in JavaScript for quite some time. I thought I had a really solid grasp on the this keyword. However, I ran in to this today and it blew my mind. I can't figure out why this is happening. When I call oneFunc(), this refers to the global object. Why does this happen?
this refere to the object, and what you are doing here is creating a function equal to the methode of the object and so you lose the reference to the object.
You can use bind
let obj = {
one: function(){
this.two();
},
two: function(){
console.log("two");
}
}
let oneFunc = obj.one;
oneFunc = oneFunc.bind(obj);
obj.one(); // two
oneFunc(); // TypeError: this.two is not a function
This question already has answers here:
How to access the correct `this` inside a callback
(13 answers)
Closed 4 years ago.
I'm simply trying to access a class method from within a function within another class method so:
class test
{
show()
{
setTimeout(function()
{
this.showInside()
},0)
}
showInside()
{
alert("WORKING")
}
}
var test2 = new test();
test2.show()
I'm obviously doing something wrong, and clearly I can't use this.showInside() within that function, but I can't figure out what I need to do...
Any help?
this depends on the context. Inside setTimeout, this doesn't refer to the instance. Here's a working example :
class test
{
constructor(){};
show(){
setTimeout((function(){ this.showInside() }).bind(this),0)
}
showInside(){
alert("WORKING");
}
}
var test2 = new test();
test2.show();
This question already has answers here:
How does the "this" keyword work, and when should it be used?
(22 answers)
Closed 6 years ago.
Hi I'm trying to create an object in jQuery and everything is working fine but somehow I cannot pass some necessary properties beyond the setInterval function bc when I test it it always pops "undefined". Here is the draft code of that I have.
Thanks in advance!!
function MyFunction(var1){
this.var = var1;
this.var2 = 2;
this.pause = 3000;
this.slideOn();
}
MyFunction.prototype.slideOn = function(){
alert(this.var); //alerts the value
setInterval(function(){ //doesnt work and it alerts "undefined"
alert(this.var2),1000,function(){}
},this.pause // works again with no hassle
};
When you use "this" inside some callback function, it uses function scoped "this". So, try setting an "outer this":
function MyFunction(var1){
this.var = var1;
this.var2 = 2;
this.pause = 3000;
this.slideOn();
}
MyFunction.prototype.slideOn = function(){
var _this = this;
alert(_this.var); //alerts the value
setInterval(function(){ //doesnt work and it alerts "undefined"
alert(_this.var2),1000,function(){}; //100 and function are senseless
},_this.pause); // works again with no hassle
};
This question already has answers here:
How to return value from an asynchronous callback function? [duplicate]
(3 answers)
How do I return the response from an asynchronous call?
(41 answers)
Closed 8 years ago.
I declare user_properties outside of my function. I then get my data from firebase and try to store it in user_properties but it ends up being undefined.
Does anyone know what I am doing wrong here?
var user_properties;
get_user_properties = new Firebase("https://<MY-URL>/users/"+auth.uid+"/properties");
get_user_properties.once('value', function (dataSnapshot) {
user_properties = dataSnapshot.val();
});
//undefined
console.log(user_properties);
I've provided for you a simple example.
var foo,
obj = new Bar("some text");
obj.set("cute cat", function(cat){
foo = "my lovely cat";
});
console.log(foo); // undefined
obj.doo();
console.log(foo); // "my lovely cat"
With this constructor function
function Bar(c){
this.mcat = c;
this.callback;
/* this method only saves that callback function */
this.set = function(catname, callback){
this.mcat = catname;
this.callback = callback;
}
/* this method calls that callback function */
this.doo = function(){
this.callback();
}
}
This question already has answers here:
How to access the correct `this` inside a callback
(13 answers)
Closed 8 years ago.
Here is my situation.
function Bird() {
this._canFly = true;
this._legs = 2;
this._flying = false;
}
Bird.prototype = {
Fly: function() {
if ( this.canFly ) {
layer.on('fly', function() {
this.setStrokeWidth(4); //this refers to layer(kinetic.js) object
this._flying = true; //this refers to Bird object
});
}//end if
} //end function
);
Here I need to access both layer object and bird object inside the callback function.
Can somebody tell me how to handle the above situation ?
var self = this
Cache a reference to this to refer to it when it changes context.