Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #29067

Re: Scope of "this" variable

Show all headers | View raw

On 29/12/2015 17:34, Teemu Likonen wrote:
> Code
>
>      var Item = function() {
>          this.variable = "variable";
>          this.fn1 = function() { return this.variable; };
>          this.foo = {
>              fn2: function() { return this.variable; }
                                        ^^^^^^
Here, 'this.variable' means 'foo.variable', but there isn't such 
identifier in foo, so 'this.variable' will return undefined, according 
to the ECMAScript 5.1, $ 8.7 - The Reference Specification Type. Also 
see $ 10.3.1, 11.1.1 and 11.1.2:
<http://ecma-international.org/ecma-262/5.1/>


>          };
>      };
>
>      var item1 = new Item();
>      console.log(item1.fn1());
>      console.log(item1.foo.fn2());
>
> prints this:
>
>      "variable"
>      undefined

But if you add a line with "this.foo.variable = 'variable2'", then the 
property reference will work fine:

   this.foo = {
     fn2: function() { return this.variable; }
   };
   // The next line will resolve the Property reference.
   this.foo.variable = "variable2";

   console.log(item1.foo.fn2()); // variable2.

>
> So function item1.fn1 returns the string "variable" but function
> item1.foo.fn2 returns undefined. The variable "this" somehow disappears
> (or doesn't last long enough) when a function object is created inside
> another object {...}. Why?
>
> I know a work-around:
>
>      var Item = function() {
>          this.variable = "variable";
>          this.fn1 = function() { return this.variable; };
>          var this_object = this;
>          this.foo = {
>              fn2: function() { return this_object.variable; }
                                        ^^^^^^^^^^^^

Oops, this is something else, not a workaround, as this_object 
references Item.variable, not foo.variable as in the previous case.

>          };
>      };
>
> But I'd like to understand why the first example works the way it does.

IMO, "Kangax" wrote a masterpiece about the 'this' keyword in 
ECMAScript. You may want to take a look:
<http://perfectionkills.com/know-thy-reference/>


> What's the difference between these to examples?

See above.


-- 
Joao Rodrigues

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread

Thread

Scope of "this" variable Teemu Likonen <tlikonen@iki.fi> - 2015-12-29 21:34 +0200
  Re: Scope of "this" variable Ben Bacarisse <ben.usenet@bsb.me.uk> - 2015-12-29 20:47 +0000
    Re: Scope of "this" variable Teemu Likonen <tlikonen@iki.fi> - 2015-12-30 10:57 +0200
  Re: Scope of "this" variable Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-12-29 22:09 +0100
  Re: Scope of "this" variable Joao Rodrigues <groups_jr-1@yahoo.com.br> - 2015-12-29 19:38 -0200
    Re: Scope of "this" variable Joao Rodrigues <groups_jr-1@yahoo.com.br> - 2015-12-29 19:46 -0200
      Re: Scope of "this" variable Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-12-30 00:42 +0100
    Re: Scope of "this" variable Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-12-30 00:35 +0100
    Re: Scope of "this" variable Joao Rodrigues <groups_jr-1@yahoo.com.br> - 2015-12-30 02:18 -0200

csiph-web