"this" refers to window when called inside a private function

Question

I'm still wrapping my head around "this". Here I use "this" inside of a function sayFoo.

I'm surprised that "this" is the window, when I log it from inside sayFoo().

What am I not understanding here about context?

myCoolThing = {
  foo: "1",
  doSomething: function() {
    sayFoo();

    function sayFoo() {
      console.log(this.foo);
    }
  }
}

myCoolThing.doSomething(); // Errors with "foo" undefined

`sayFoo` is not invoked as a method on `myCoolThing`. That's just how [`this`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this) works. — Bergi, Jun 16 '14 at 05:17
*"What am I not understanding here about context?"* The value of `this` is determined by the function is **called**, not where/when/how it was defined. Whenever you call a function like `foo()`, `this` refers to the global object unless it was explicitly bound to a specific value. Have a look at the MDN documentation to learn more about `this`: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this — Felix Kling, Jun 16 '14 at 05:23
possible duplicate of [How does the "this" keyword in Javascript act within an object literal?](http://stackoverflow.com/questions/13441307/how-does-the-this-keyword-in-javascript-act-within-an-object-literal) — slebetman, Jun 16 '14 at 06:51
@Bergi: Yes, really. The answer to this question is fully encapsulated in my answer to that question. I frequently update that answer as and when javascript changes the behavior of "this". — slebetman, Jun 17 '14 at 00:20
@slebetman: Hm, the canonical question would be [JavaScript “this” keyword](http://stackoverflow.com/q/3127429/1048572). And no, the *question* itself is not a duplicate, even if your answer there does answer it. — Bergi, Jun 17 '14 at 00:41
@Bergi: A question is considered a duplicate if another different question has the same answer. A question is queued for deletion if another question is identical. There is (or should not be) no stigma in asking duplicate questions. It's the point of the duplicate flag. It will link all the ways you can ask about a concept you don't understand to a single answer. When people search for the concept they'll obviously be using different strings. Hopefully one of the searches will lead to this question which would lead to my answer. — slebetman, Jun 17 '14 at 03:30

score 1 · Accepted Answer · answered Jun 16 '14 at 05:17

When you call sayFoo, it is called without the object as the context. Only functions which are properties of the object are called with the context as the parent object. This would work:

myCoolThing = {
  foo: "1",
  doSomething: function() {
    sayFoo.call(this);

    function sayFoo() {
      console.log(this.foo);
    }
  }
}

More info on context.

Function.prototype.call() simply calls the function with this set to the first parameter it is called with (which, in this case, is the object since that is what this is in a function which is a property of an object).

"this" refers to window when called inside a private function

1 Answers1