Why are we writing a window?

Question

When I added some initialization code to the web page, I found myself writing window.onload = ... for the ninetieth time when the thought hit me.

window. not required because window is the current object. So this is optional! But no one writes only onload = ... , and I wonder why this is so.

I mean, we have no problem writing other things, say alert without a window. qualifier window. .

 window.onload = function() { alert('Your window has loaded'); }; 

while in reality alert is the same way as the window object as onload .
So why the difference? Why do even official websites like W3C do this?

Answer 1

We write window. when we want to be explicit. There are basically two cases where this is a good form to use:

• The properties and methods of the window object are all that are part of the window interface . The .onload that you mentioned is an example of this, other things like window.scrollY , window.status , window.parent , window.open() , window.focus() , window.removeEventListener() .
• creation of global properties. Assigning window.myGlobalVar from any scope is a common JS idiom for creating a global "variable". Admittedly, it's even better to use to explicitly declare it with var .

Although we could “optionally” omit the window. part here window. , it's unusual. In particular, the creation of implicitly global variables through assignment is despised and is usually regarded as a mistake. Therefore, if you do this on purpose, you declare your intention using window. .

However, the first case is not always clearly defined. We often omit the window. part window. when the property that we want to use is essentially a static global variable and is not necessarily associated with the window object, even if it is formally indicated on it. You rarely see anyone using the document , atob() , Worker , setTimeout() or fetch() window. prefix window. just like you are not using window.JSON.parse or window.Array for inline objects (although that would be true).

For some other properties, such as navigator , location or alert() , this is not always clear, and they are used, maybe fifty fifty without or not.

Answer 2

I see the following reasons:

• Reducing the volume of the search chain will slightly improve performance. This is also visible in IIFE, where window sent as a function parameter, and a local link to the window is used inside it.
• If a function / member defined in window globally is redefined in a scope, then it will not work as expected, so the link explicitly points to the correct function / member. This is useful for creating a function / member with the same name as the global one, and still access the global member from a hidden area.

Answer 3

Because .onload no exception to window . It can also be used, for example, as document.onload . That way, you define it depending on when you want your script to be executed.

Answer 4

The default window object is initialized by the browser. This is good practice for an explicitly defined window object that affects performance, and your code becomes clear.