Javascript: constructor function this keyword [duplicate]

Question

What is the difference between the following two code segments:

function HelloService(){
  var service = this;
  service.itemList = []

  service.hello = function(){    
    return "Hello World!!";
  };

  service.addItem = function(){
    service.itemList.push(1);
  }
}

function HelloService(){
  var service = this;
  var itemList = [];

  var hello = function(){    
    return "Hello World!!";
  };

  service.addItem = function(){
    itemList.push(1);
  }

}

Because as far as I understand the this inside the hello function and outside the hello function points to the same instance.

Could someone explain the above problem w.r.t to JAVA?

EDIT: I have added an addItem function. Here I don't understand the difference between service.itemList and var itemList inside the addItem function. Could you explain the difference inside that function?

this inside the function, depends entirely on how you call the function — adeneo
– adeneo, Commented Oct 31, 2016 at 23:51
in the first one (with this.hello) you can call the hello function from the outside (console.log(new HelloService().hello());). In the second one hello is just a local variable, not accessible from the outside. — FirePanther
– FirePanther, Commented Oct 31, 2016 at 23:55
It is really worth reading up the exact meaning of "this" in JS. Understand that it has almost nothing to do with any concept of class as in Java. As adeneo says, it is about the call, not the declaration. — DrC
– DrC, Commented Oct 31, 2016 at 23:55
On the other hand, in the second example it doesn't matter what this is at all, as the variable has nothing to do with this. — adeneo
– adeneo, Commented Oct 31, 2016 at 23:56
It doesn't matter if this is the same inside and outside the function, the function creates it's own scope, and the variable is declared in that scope, and as variables are function scoped, they are only accessible within that scope (or a "lower" scope). — adeneo
– adeneo, Commented Nov 1, 2016 at 0:03

Paul · Accepted Answer · 2016-10-31 23:51:45Z

2

Local variables in Javascript functions do not get added as properties of this. The first is equivalent to:

function HelloService(){
  this.hello = function(){    
    return "Hello World!!";
  };
}

But not:

function HelloService(){
  var hello = function(){    
    return "Hello World!!";
  };
}

Which does nothing since the function referenced by hello is never used and is not accessible outside the scope of HelloService.

answered Oct 31, 2016 at 23:51

Paul

142k28 gold badges285 silver badges272 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

erictgrubaugh Over a year ago

Some further resources for learning about JS this: derickbailey.com/email-courses/masteringthis, developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…, javascriptissexy.com/…

chiliNUT Over a year ago

var varName="val"; is generally only equal to this.varName="val"; when in the global context.

adeneo Over a year ago

@chiliNUT - it's not about context or the value of this, but scope. When inside a function, even if this is the global, the variable won't be added to it -> jsfiddle.net/9ygu01nj

chiliNUT Over a year ago

@adeneo hey, II'm a little confused, I think we are in agreement, its obvious why your fiddle doesn't work; I use scope and context as synonyms, but clearly you are using them differently, if 2 variables are in the same scope, are they not in the same context? Please clarify :)

chiliNUT Over a year ago

ie, in your example, this is the global object but clearly you are not in global scope, you are in a function's scope

|

Collectives™ on Stack Overflow

Javascript: constructor function this keyword [duplicate]

1 Answer 1

6 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Linked

Related