this inside callback function [duplicate] - javascript

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.

Related

this is window inside the function of a class [duplicate]

This question already has answers here:
How to access the correct `this` inside a callback
(13 answers)
How does the "this" keyword work, and when should it be used?
(22 answers)
Closed 1 year ago.
I have some code here.
I am aware that this reference wont be carried in anonymous functions.
But here, even when using a function of an object, the this inside that is window.
var MyClass = function (div) {
this.array = [];
};
MyClass.prototype = {
addToArray: function (elem) {
this.array.push(elem);
},
processAndAdd: function(elemArray){
elemArray.forEach(this.addToArray);
}
}
var myObj = new MyClass();
myObj.processAndAdd([1, 2, 3]);
console.log('test');
Error: Line: this.array.push(elem);
push of undefined.
On inspection, the this here is window Object
I want to know why this is window here, and how to restructure my code to properly handle this.
The reference to this object is no more MyClass constructor after you pass the callback function body as callback to forEach. Bind the function body with the current this context and your code should work.
var MyClass = function (div) {
this.array = [];
};
MyClass.prototype = {
addToArray: function (elem) {
this.array.push(elem);
},
processAndAdd: function(elemArray){
elemArray.forEach(this.addToArray.bind(this));
}
}
var myObj = new MyClass();
myObj.processAndAdd([1, 2, 3]);
console.log('test');

Angular 2 - Using 'this' inside setTimeout [duplicate]

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);

Javascript - referring to the instantiated object [duplicate]

This question already has answers here:
How to access the correct `this` inside a callback
(13 answers)
Closed 7 years ago.
Let's say I have a javascript function as follows:
car.prototype = {
this.stolen = "",
initialize: function(){
this.stolen = false;
},
steal: function(){
Event.observe(window, "resize", function(){
this.stolen = true;
});
}
}
In the steal method, how can I refer to the stolen property of the car object within the Event.observe() method? In the code above, this in the Event.observe() method is referring to the window instead of the car object.
You bind the function:
Event.observe(window, "resize", (function(){
this.stolen = true;
}).bind(this));

How to make this refer to the constructor [duplicate]

This question already has answers here:
How to access the correct `this` inside a callback
(13 answers)
Closed 7 years ago.
I have the following code
function perso (image_mere, emplacement_x, emplacement_y, x, y, direction) {
this.source = image_mere;
this.sprite = createElement('div');
// some other properties
this.sprite.addEventListener('click', function() {
dindong = this;
(function(dindong) {
var canvas = document.createElement('canvas'),
context = canvas.getContext('2d');
alert(dingdong.image_mere)
})(dindong);
}, true);
};
As you can see, the keyword this refers to the sprite, howerver i want to refer to the object so i can get the properties :/
Thank you
You can use bind:
}.bind(this), true); //this is last line of your listener

Variable undefined when updated inside a function [duplicate]

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();
}
}

Categories

Resources