0

Why here "this" is different for self executing code(window/globalScope), inside a object's member function?

foo = "Window_foo"
var myobj = {
  foo: 'Object_bar',
  func: function(){
    var self = this;
    console.log("outer this.foo " + this.foo);
    console.log("outer self.foo " + self.foo);
    (function(){
       console.log("inner this.foo " + this.foo);
       console.log("inner self.foo " + self.foo);
    }());
  }
}
myobj.func();

I get below output:

outer this.foo Object_bar
outer self.foo Object_bar
inner this.foo Window_foo
inner self.foo Object_bar

func is the member function of myObj object. "this" inside it must be the myObj object. Then how self executing function inside it has "this" as window object?

Ratnesh Lal
  • 401
  • 4
  • 8
  • 18
  • this belongs to the method in func(), but in a free floating function, it's global default – dandavis Mar 09 '15 at 15:33
  • 1
    that is the default value for `this`. – Daniel A. White Mar 09 '15 at 15:34
  • FWIW, it's usually "immediately invoked function" rather than "self-executing function". – Andy Mar 09 '15 at 15:38
  • As a very experienced JavaScript user, I can at least agree with you that it doesn't make too much sense. The rules are consistent, and you can live with them if you know them, but they don't make much sense. – Katana314 Mar 09 '15 at 15:38
  • Next to the duplicate, see also [IIFE context issues](http://stackoverflow.com/q/7653757/1048572) – Bergi Mar 09 '15 at 15:39

2 Answers2

3

Self executing functions have the window object as the value of their this, even if it's inside a method of your object.

Spencer Wieczorek
  • 21,229
  • 7
  • 44
  • 54
0

to self reference a singleton object's elements. you can declare the function after you create the object like

foo = "Window_foo"
var myobj = {
  foo: 'Object_bar'
}

  myobj.func: function(){
    console.log("outer myobj.foo " + myobj.foo);
    console.log("outer myobj.foo " + myobj.foo);
    (function(){
       console.log("inner myobj.foo " + myobj.foo);
       console.log("inner myobj.foo " + myobj.foo);
    }());
  }
Azadrum
  • 756
  • 6
  • 23
  • In this case, he doesn't have to actually split it like that because `func` is a function that won't be executed until after `myobj` is defined. Also, side-note, your syntax is wrong here: `myobj.func: function..` – Kevin B Mar 09 '15 at 15:41
  • Why the comment by dandavis - "this belongs to the method in func(), but in a free floating function, it's global default", doesn't hold true for the way you have described here? – Ratnesh Lal Mar 09 '15 at 15:41
  • @RatneshLal In this example, he isn't using `this`, he used `myobj.foo` which will always reference whatever is stored in `myobj.foo` – Kevin B Mar 09 '15 at 15:42
  • Ohh my bad in noticing that, sorry. So for all anonymous self executing function "this" is MUST be window object. Correct? – Ratnesh Lal Mar 09 '15 at 15:45
  • atleast this is the way i know for sure. i searched finding a way to reference object itself from within a function of it, that i couldnt find. And i am currently using this to store my application wide variables that can go together. so i wont pass around tens of variables. – Azadrum Mar 09 '15 at 15:48