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 6 years ago.
I'm trying to write some JS object. Getting stuck on something, I don't understand how contexts work. Here is a simple example :
var MyApp = function(el) {
this.el = el;
};
MyApp.prototype.bind = function() {
window.setTimeout(this.start, 300);
}
MyApp.prototype.test = function(msg) {
console.log(msg);
}
MyApp.prototype.start = function() {
console.log(this); // Returns the window context
this.test('Hello'); // Doesn't work, of course.
}
var myapp = new MyApp(el);
myapp.bind();
Problem is when calling the start method, I'm in the window context because of the window.setTimeout. Is there a way to fix this or is it a pattern design issue?
Thanks ;)
Related
This question already has answers here:
Losing "this" context in JavaScript when passing around members [duplicate]
(3 answers)
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 last year.
If I use the first representation, the console will log the name, however in the second one it does output "JS Bin Output", any idea what happened?
let person = {
name: 'Fred',
sayMyName: function(params) {
return (this.name);
},
};
let obj = person;
person = null;
let sayMyName = obj.sayMyName;
console.log(obj.sayMyName()); // logs `Fred`
console.log(sayMyName()); // logs `JS Bin Output`
This question already has answers here:
How does the "this" keyword work, and when should it be used?
(22 answers)
Closed 3 years ago.
In the following code, why test function's second this points to obj, whereas the first this points to window object?
In particular, how can I guess the value of this by looking at a piece of code?
var test = function(){
console.log('first', this)
return function(){
console.log('second', this)
}
}
var obj = {
a: 1,
b: test()
}
obj.b() // execute function
You call test on object creation triggering the first logging and store the created function to the object. You call that function on global level and therefore this gets resolved at that scope.
Is this some sort of interview question?
What are you trying to achieve/understand?
Edit:
See this guide for a good explanation of 'this':
https://dmitripavlutin.com/gentle-explanation-of-this-in-javascript/
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 5 years ago.
I don't understand, why when I set a function to an object instance, whenever it is accessed from something asynchronous, like setTimeout or a promise, it is undefined. Can someone please explain? Is there a workaround?
Thanks
function Animal() {
this.check = function () {
writeln(typeof this.test);
}
setTimeout(this.check, 1000); // returns undefined
}
var animal = new Animal();
animal.test = function () {
}
animal.check(); // returns function
Because you're losing context here:
setTimeout(this.check, 1000);
So therefore this inside check will be window, which does not have a test property. Maybe do:
setTimeout(this.check.bind(this), 1000);
Side note: Having dynamically assigned functions is a performance killer and therefore bad style. There's always a better way...
This question already has answers here:
How does the "this" keyword work, and when should it be used?
(22 answers)
Closed 6 years ago.
I am trying to understand internals of Javascript. I have some misunderstanding of this keyword.
Everywhere stated that this keyword is reference to the object that invokes function.
But as far as I know function is an object as well.
So consider this example
var car = {
brand: "Nissan",
getBrand: function(){
var closure = function(){
console.log(this.brand);
console.log(this);
};
return closure();
}
};
car.getBrand();
Why does this reference inside closure point to the global object instead of getBrand wrapping function ? Again everything is object in javascript, so I cannot understand this behavior.
Please explain this from internals perspective.
Thanks
Because value of this is determined by how function is called..closure is called with no reference of context and global context is window(in Browser)
Use Function.prototype.call to specify this context while function is invoked
var car = {
brand: "Nissan",
getBrand: function() {
var closure = function() {
console.log(this.brand);
console.log(this);
};
return closure.call(this);
}
};
car.getBrand();
This question already has answers here:
Use of 'prototype' vs. 'this' in JavaScript?
(15 answers)
Prototyped and a non-prototyped method? [duplicate]
(1 answer)
Closed 8 years ago.
Consider the following code:
function someObj() {
this.someFunction = function() {
console.log('someFunction');
}
}
someObj.prototype.foo = function() {
console.log('foo');
}
I can call both like so:
var test = new someObj();
test.someFunction(); // Logs 'someFunction'
test.foo(); // Logs 'foo'
How would variable scope be affected here? Is there an advantage / disadvantage to each approach?