window.location versus just location

JavascriptLocationwindow.location

Javascript Problem Overview


Across the web, I see a vast number of JavaScript programmers writing window.location instead of just location. I was curious if anyone could offer an explanation as to why. window is the global object, and therefore it is unnecessary to include -- isn't it? I mean, you don't see people write window.Math.floor or new window.Date(), so I'm curious as to why it would be specified with location.

I understand that location is considered to be a "property" of the window you're in, which I suppose makes some sense. But even so, I don't see any reason to specify the global object; it's not possible to overwrite location in the first place, not without redirecting the page.

So, is this just a quirk that has been used for so long that it's become integrated with how we write JavaScript, or is there some tangible reason to do things this way? I checked Google, but alas, I came up with nothing...

Javascript Solutions


Solution 1 - Javascript

I always use window.location in my code for two principal reasons:

  1. It's a good habit to avoid global variables whenever possible. Using the window. prefix reminds me that the variable is global and that others aren't.
  2. The nature of Javascript's scoping allows you to override variables set higher up the scope tree. This means that you could have set var location somewhere in a containing scope (it's not an unlikely word to use as a variable name) and you'd be working on that instead.

For me, clarity of purpose when coding is very important as it helps me avoid writing bugs and then helps me find them when I do.

Solution 2 - Javascript

Partly for safety in case someone defines a location variable somewhere in the scope chain. the window.location makes it an explicit reference to the property of window.

Example: http://jsfiddle.net/dr6KH/

(function() {
    var location = 'new value'; // creating a local variable called "location"
    
    (function() {
        alert(location);  // alerts "new value"
        
        alert(window.location);  // alerts the toString value of window.location
    })();
    
})();

Solution 3 - Javascript

There's a big difference between window.location and the native Math and Date objects, which is that Math and Date are native JavaScript objects that are specified to exist as properties of the global object, while window.location is a property of the window host object (a host object is an object representing some aspect of the environment, provided by the environment, and is not subject to the same rules as native JavaScript objects. Other host objects include document and any DOM element).

window in browsers serves two purposes: first, acting as the (well-specified) ECMAScript global object, and second, acting as a host object providing information about the browser environment. For uses of window in its host object capacity, I prefer to be explicit and provide the window. prefix: the fact that location works without it is just a coincidence that comes from window's schizophrenic nature. Also, as pointed out by other answers, this also has the advantage of protecting you in the case when another location variable exists in the current context.

One good reason for not prefixing Date or Math with window. is that doing so creates code that does not work in a non-browser environment. Other environments generally do not provide window as an alias for the global object.

Solution 4 - Javascript

Part of coding is clarity. Unlike Math or Date, location is conceptually a property of the window, so the code becomes more clear to include it. The "window." prefix should ideally be removed for minification.

You are probably correct that a lot of the reason is historical. Javascript has an extensive history of copying and pasting.

Solution 5 - Javascript

It is not always just a matter of style - I was trying to load social media buttons asynchronously after the window's load event by appending script elements to a fragment, and then appending that fragment to the document. Twitter's widgets.js uses location.href in several places and was causing the following error in IE 8/9: Unexpected call to method or property access. I haven't figured out why, but this only happens when visiting the page via a link from another page. If you just append the script element to the head or use window.location.href, this doesn't occur, so it appears to be some weirdness with IE 8/9 and createDocumentFragment().

Example:

<a href="http://twitter.com/share" class="twitter-share-button" data-url="http://www.stackoverflow.com">Tweet</a>
<script>
(function (d, t) {
	var head = document.getElementsByTagName('head')[0];
	var frag = d.createDocumentFragment();
	var s = d.createElement(t);
	s.async = true;
	s.src = 'http://platform.twitter.com/widgets.js';
	frag.appendChild(s);
	head.appendChild(frag);
} (document, 'script'));
</script>

Solution 6 - Javascript

The window object is the default working namespace, so location will be equal to window.location.

I think that using location is a bit ambiguous, use window.location for clarity.

Solution 7 - Javascript

It's just a matter of style.

Conceptually, location is a property of the window (the window is at a location), unlike Math or Date.

Solution 8 - Javascript

location is a property of the window object, so you can get it by requesting window.location. But if you don't specify an object, JavaScript assumes you want the window object. So just requesting location is the same as requesting window.location.

Solution 9 - Javascript

They are actually identical. Technically, the "window" object IS the same thing as the root scope for Javascript variables.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionReidView Question on Stackoverflow
Solution 1 - JavascriptlonesomedayView Answer on Stackoverflow
Solution 2 - Javascriptuser113716View Answer on Stackoverflow
Solution 3 - JavascriptTim DownView Answer on Stackoverflow
Solution 4 - JavascriptfuzzyTewView Answer on Stackoverflow
Solution 5 - JavascriptrhurkesView Answer on Stackoverflow
Solution 6 - JavascriptJacob RelkinView Answer on Stackoverflow
Solution 7 - JavascriptSLaksView Answer on Stackoverflow
Solution 8 - JavascriptarlomediaView Answer on Stackoverflow
Solution 9 - JavascriptAdam BatkinView Answer on Stackoverflow