how to make setTimeout refer to context of object?

Question

var myObj = {
    name:"mike",
    go:function(){
        console.log(this.name);
    }

}

myObj.go()   //logs out mike
setTimeout(this.myObj.go,200)  //logs out (emptyString)

@adeneo The `this` pointer would not be set that way (well, it'd reference the global object in non-strict mode). — Fabrício Matté, Apr 08 '13 at 21:18
possible duplicate of [Pass correct "this" context to setTimeout callback?](http://stackoverflow.com/questions/2130241/pass-correct-this-context-to-settimeout-callback) — Fabrício Matté, Apr 08 '13 at 21:24
`this` isn't context. It's a special variable that is set by the call and can be any object (es3) or any value (es5 strict mode). — RobG, Apr 08 '13 at 23:37

Joseph · Answer 1 · 2013-04-08T21:20:06.123

1

Try this:

setTimeout(function(){
  myObj.go();
},200);

edited Apr 08 '13 at 21:20

answered Apr 08 '13 at 21:17

Joseph

117,725
30
181
234

score 1 · Answer 2 · answered Apr 08 '13 at 21:17

1

Define a variable reffering to the object before:

var _this = this;
setTimeout(function() {_this.myObj.go();}, 200);

answered Apr 08 '13 at 21:17

Tomáš Zato

50,171
52
268
778

1

This is the most complete solution code, though OP seems to be using `this` to reference the global context, otherwise a variable declared through `var` would hardly be assigned to a property of an object. – Fabrício Matté Apr 08 '13 at 21:23
1

@FabrícioMatté Yeah the weird part is why they're referencing it with `this`, when they declare it with `var`. I think this method would be necessary if `this` was something specific to the context and was needed. – Ian Apr 08 '13 at 21:26
@Ian Exactly. `=]` Finished reading answers, time to spend some upvotes then. – Fabrício Matté Apr 08 '13 at 21:27

Ian · Answer 3 · 2013-04-08T21:31:05.623

1

Several ways:

setTimeout(this.myObj.go.bind(this.myObj), 200);

or

var that = this;
setTimeout(function () {
    that.myObj.go();
}, 200);

Note that .bind isn't supported in older browsers, so a polyfill may be required in order to support it. Here's some information about the method: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind

edited Apr 08 '13 at 21:31

answered Apr 08 '13 at 21:17

Ian

50,146
13
101
111

Note that `.bind` has been introduced in ES5, therefore to support older browsers one should either use your version with a function wrapper or a [`.bind` shim](https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind#Compatibility). – Fabrício Matté Apr 08 '13 at 21:28
@FabrícioMatté Yeah, thanks for pointing it out - I didn't feel compelled enough to include that :) I'm wondering when it's going to be time that we stop pointing out when old browsers don't support certain methods. Probably never, as people will use old IE forever... – Ian Apr 08 '13 at 21:32
Well, guess I'm one of the few which still spends sleepless nights patching my HTML5 page to be fallbackable to IE6 (yeah really) but well, I believe there isn't much use in supporting IE<8 so I'm slowly migrating and removing old IE hacks. None from us want to restrict ourselves from using advanced HTML5/CSS3 features just because of old IE, so my methodology now is just to apply graceful degradation down to IE8 tops. And yeah, IE8 doesn't support `.bind()` and it'd generate an ugly JS error breaking script execution. `:P` – Fabrício Matté Apr 08 '13 at 21:37

simple-thomas · Answer 4 · 2013-04-08T21:18:57.317

1

var myObj = {
    name:"mike",
    go:function(){
        console.log(this.name);
    }

}

setTimeout(function(){myObj.go()},200)

edited Apr 08 '13 at 21:18

answered Apr 08 '13 at 21:18

simple-thomas

671
7
20

score 1 · Answer 5 · edited Apr 08 '13 at 21:21

1

Try this

var myObj = {
    name:"mike",
    go:function(){
        console.log(this.name);
    }

}

myObj.go();   //logs out mike
setTimeout(function(){
    myObj.go(); //logs out mike too
},200);

edited Apr 08 '13 at 21:21

Fabrício Matté

69,329
26
129
166

answered Apr 08 '13 at 21:20

raj-nt

149
2

score 0 · Answer 6 · answered Apr 08 '13 at 21:39

Your code is right minus a few things.

setTimeout(this.myObj.go,200)

Should be

setTimeout(function() {myObj.go()},200)

It was undefined because this.myObj was not in the scope of setTimeout, nor was it wrapped in an anonymous function, or a variable function. You were on the right track though!

how to make setTimeout refer to context of object?

6 Answers6