The window Object in JavaScript Explained
window is the global object in browsers. Here is what it holds, how var leaks to it, and why it matters.
The window Object in JavaScript Explained
In browsers, window is the global object. It represents the browser tab and holds all global variables, built-in APIs, and the DOM.
What window Contains
- Global variables:
vardeclarations at the top level become properties ofwindow. - Built-in APIs:
console,setTimeout,fetch,localStorage,Math,JSON,Object,Array,Promise, etc. - DOM:
document(the parsed HTML),window.location,window.history,window.navigator. - UI methods:
alert,prompt,confirm,scrollTo,open. - The
thiskeyword at the global level:window === this(non-module script).
var Leaks to window
var x = 5; console.log(window.x); // 5
This is a common source of bugs. let and const do not leak:
let y = 10; console.log(window.y); // undefined
window vs document
windowis the browser tab (the global object).documentis the parsed HTML page inside that tab (window.document).
window.document.body; // the <body> element document.title; // the page title
Common APIs on window
window.setTimeout(() => {}, 1000); window.addEventListener("resize", handler); window.localStorage.getItem("key"); window.fetch("/api").then(r => r.json());
Because these are global, you can use them without the window. prefix.
Performance and Security Implications
- Polluting
windowwithvarglobals can cause naming collisions and bugs. - Third-party scripts can read and overwrite your
windowproperties. - Use modules (
import/export) to keep globals out ofwindow. - Use IIFEs to avoid leaking
varin script files.
globalThis Is the Portable Way
globalThis.setTimeout; // works in browsers, Node, workers
The Takeaway
window is the global object in browsers. It holds built-in APIs, the DOM, and var-declared globals. let/const do not leak to it. Use modules and IIFEs to avoid polluting it. Use globalThis for portable global access.
It is the global object in browsers. It represents the browser tab and holds global variables (from var), built-in APIs (console, setTimeout, fetch), the DOM (document), and UI methods (alert, prompt).
No. Only var declarations at the top level become properties of window. let, const, and class declarations live in a separate global lexical environment and do not attach to window.
window is the global object representing the browser tab. document is the parsed HTML page inside that tab, accessible as window.document. window holds APIs and globals; document holds the DOM tree.
Use ES modules (import/export) to keep declarations out of window. Use IIFes in script files to contain var. Avoid var at the top level; prefer let and const.
globalThis is the standard way to access the global object across environments. It is window in browsers, global in Node.js, and self in Web Workers. Use it for portable code that runs anywhere.
Ready to master React completely?
Want to upskill yourself, crack your next interview, and get your dream job? Join our comprehensive course to dive deeper with high-quality video tutorials, solve interview questions, and a premium community.
Master React
Want to upskill yourself, crack your next interview, and get your dream job? Join our comprehensive course.