10

I was reading Chapter 2: this All Makes Sense Now! from You Don't Know JS, and decided to do this experiment.

I have this simple enough script foo.js:

var a = 'foo';
var output;

// lets find a way to output strings in both
// Chrome and Node.js
if (typeof alert === 'undefined') {
    output = console.log;
} else {
    output = alert;
}

function getA() {
    return this.a;
}

var foo = getA();
output(foo);

I am expecting following things when getA() is called:

  1. Since the call site of getA is in global scope, getA() will be bound to global object.
  2. Since var a is declared in global scope, I take it that global object will have a property named a, and this property is same as the variable a.
  3. Because of that, I expect this.a to refer to variable a.
  4. Thus I expect output(foo) to print the string foo.

However, when run in Node.js (non-strict mode), this is the output:

$ node foo.js
undefined

Then I included the same script in a simple HTML page, and loaded it in chrome.

<html>
  <head>
    <script src="foo.js" type="text/javascript"></script>
  </head>
  <body>
  </body>
</html>

Chrome alerts the string foo, just as expected.

Why does the output of Chrome differ from Node.js?

Community
  • 1
  • 1
sampathsris
  • 21,564
  • 12
  • 71
  • 98

3 Answers3

15

Since the call site of getA is in global scope, getA() will be bound to global object.

This is a misunderstanding of the this binding rules from my book. The call site's location (aka "in global scope") is entirely irrelevant. It's the manner in which the call is made, and only that.

It's not where getA() happens that matters, but that getA() is a plain normal function call. THAT is what determines that you'll get the global object bound to the this for that call.

The other answers here are correct... the scope your node main program runs in is actually a module (function wrapped), not a real global scope.

Kyle Simpson
  • 15,725
  • 2
  • 33
  • 55
9

Since the call site of getA is in global scope, getA() will be bound to global object.

no, that's not true for node - your script is wrapped into a function here so your example is actually this code:

(function (exports, require, module, __filename, __dirname) {
  var a = 'foo';
  var output;

  // lets find a way to output strings in both
  // Chrome and Node.js
  if (typeof alert === 'undefined') {
    output = console.log;
  } else {
    output = alert;
  }

  function getA() {
    return this.a;
  }

  var foo = getA();
  output(foo);
})(exports, require, module, 'file.js', '/dir/name');
Andrey Sidorov
  • 24,905
  • 4
  • 62
  • 75
8

NodeJS behaves differently than browsers. The top-level scope is not the global scope, it's the scope within that file or module. Drop the "var" and your code will work (a will become truly global) in a node environment and it will console.log the string 'foo'.

See the following page for a full reference: http://nodejs.org/api/globals.html

OR

How to use global variable in node.js?

Community
  • 1
  • 1
gchaturvedi
  • 121
  • 5
  • So why does NodeJS behave differently than browser in this scenario? Yes I could drop `var` and the example will work. But I'm not interested in making globals in Node.js. I want to understand how the binding of `this` works here. What exactly is bound to `this` in this example? – sampathsris Nov 20 '14 at 04:38
  • 1
    In your browser, "this" is the window object. In node, it is an object called "global". Try console.log(this); inside your getA() method, and compare this to console.log(this) in Chrome's console. You will notice they are both top level objects that give you javascript primitive & object types such as ArrayBuffer, setTimeout, setInterval. You could also define a global object in node by doing "global.name_of_var". – gchaturvedi Nov 20 '14 at 04:44
  • See lines 788-795 in node's source code to see exactly what it's doing. It uses a method called NativeModule.wrap() around your source code upon compilation. https://github.com/joyent/node/blob/master/src/node.js#L788 – gchaturvedi Nov 20 '14 at 04:56
  • @Krumia `this` is global object. Its just that `a` is tied locally to foo.js and not to global. – user568109 Nov 20 '14 at 04:58