3

I'm writing a javascript app that uses a lot of global variables:

window.x = 0;
window.y = 0;

I'd like to be able to use an alias for the window object:

w = window;
w.x = 0;
w.y = 0;

However, when I set w to window, it seems to recursively add itself to the DOM:

w = window;
// In the DOM Explorer:
> w   page.html
>   w   page.html
>     w   page.html...

This seems like it would ruin the memory, but the app is running fine. Is there a better way to create global variables or a window alias?

Travis Heeter
  • 13,002
  • 13
  • 87
  • 129
  • 1
    Why not just declare them outside of everything at the top of your script then you don't need to add `window.`? Or are you reusing names and namespacing? – StudioTime Apr 04 '16 at 20:24
  • 2
    `window.window.window.window.document.title` is legit and doesn't waste RAM... in the same way, since `w==window`, `w.w.w.w == window.w.window.w`. in short: no problem... – dandavis Apr 04 '16 at 20:27
  • 1
    _"it seems to recursively add itself to the DOM"_ - not really the DOM, window isn't part of it strictly speaking; but anyway, window is the top-most object in JS run in the browser, and _every_ global variable you declare becomes a property of the window object - so does your `w` variable here, what value it has doesn't play any part in it. Circular references, mostly between JS variables and actual HTML element objects, used to be a problem in browsers, IE in combination with event handling had famous memory holes; what you are doing here however should not cause any browser any trouble. – CBroe Apr 04 '16 at 20:29
  • That being said, if you are writing an app, you might want to look into ways to better encapsulate your code and its data from the "outside world" anayway; an IIFE is a starting point for something small-scale. – CBroe Apr 04 '16 at 20:30
  • 1
    The reason it appears to recursively add it to the DOM is because your having the object reference itself. This isn't a problem and will not consume any more memory than adding a property to any other object. In JavaScript objects are referenced by memory address. – James Apr 04 '16 at 20:32
  • it would be nice if devtools differently styled "sub-objects" that == their parent – dandavis Apr 04 '16 at 20:33

3 Answers3

2

Whenever you are declaring a variable without a var, you are effectively assigning it to window object.

So, 

w = window;

becomes

window.w = window

and that's why the recursive behavior.

You can use an IIFE to achieve what you want.

(function(w) {
   w.x = 0;
   w.y = 0;
})(window)
Bhabishya Kumar
  • 731
  • 3
  • 7
  • what does does the IIFE do for us here? – dandavis Apr 04 '16 at 20:54
  • Its a standard way to alias global objects like window, jQuery without adding more of our own, like w here. More about this [here](http://www.nicoespeon.com/en/2013/05/properly-isolate-variables-in-javascript/) – Bhabishya Kumar Apr 04 '16 at 21:18
0

Your global variable doesn't waste memory, but you should avoid global variables.

(function() {
  var w = window; // Create local alias
  window.window; // window
  w.w; // undefined (probably)
})();

Of course, this assumes window points to the global object. If you want to get a reference to the global object even if window is shadowed, see Getting a reference to the global object in an unknown environment in strict mode.

Community
  • 1
  • 1
Oriol
  • 274,082
  • 63
  • 437
  • 513
0

In all browsers excepts IE, window.window is just a hooky way to reference.. well.. window. So window === window.window, true.

And window.window.window is also the same as window.window.

Info: http://javascript.info/task/window-windowwindow

Aral Roca
  • 5,442
  • 8
  • 47
  • 78