Can I explicitly reference a JavaScript global variable that's been shadowed by a local with the same name?

Question

I've seen tons of posts about the difference between global and function scope in JavaScript, far too many to link here. I've also seen my exact question asked about Python. So what I want to know is, how can I access a global variable when a "closer" scope also has a variable with the same name?

var a = "global";
function b(){
  var a = "local";
  var magic = ...; // somehow put "global" in magic
  console.log(magic); // should print "global"
}

In browser only, I figured out that you can use window.a to specify the global. Is there anything that works server-side as well?

Answer 1

If it's really a global (i.e. not just in the outer scope), you can do this :

var magic = (function(name){return this[name]}).call(null, "a");

From ECMAScript's documentation (10.4.3) :

Entering Function Code

The following steps are performed when control enters the execution context for function code contained in function object F, a caller provided thisArg, and a caller provided argumentsList:

If the function code is strict code, set the ThisBinding to thisArg. Else if thisArg is null or undefined, set the ThisBinding to the global object.

Note that you can't test this in jsFiddle, as the global scope isn't where you define your a.

Demonstration:

var a = "global";

function b(){
  var a = "local";
  var magic = (function(name){return this[name]}).call(null, "a");
  document.body.textContent = 'a: '+JSON.stringify(magic); // print "global"
}

b();

Answer 2

There is no standard to do that. For my own purposes, I always put my variables in a container where the name resembles the project name:

var PROJECT = {}; // Put all "globals" for "project" into this container

That way, I can collect all variables in one place and if I need to pass the "globals" around, I have to pass at most one reference.

Answer 3

Using your code as the basis of the answer, you could use the following to actually pull the global version of "a" as opposed to the local version:

var a = "global";
function b(){
  var a = "local";
  var magic = this.a; // somehow put "global" in magic
  console.log(magic); // should print "global"
}
b();

This will only work if you are calling the b() function in the form above. An example in which this will not work is as follows:

var a = "global";
function b(){
  var a = "local";
  var magic = this.a; // somehow put "global" in magic
  console.log(magic); // should print "global"
}
b.call({a : "other context"});

In the case above, "other context" will be printed to the console.

Answer 4

You can access the global through the global object. In this case window and the local by name inside the current context.

Here is an fiddle example.

Answer 5

well I don´t have a direct answer, but a workaround is to use a well established container, window for example

window['a'] = "global";

This isn't a very clean solution but it does the job