Lesson 5 · window and the Browser Object Model

window is not "the browser". It is the global object.

Every global variable, every constructor from Lesson 3, the document, and all the browser services (location, history, navigator…) are properties of one ordinary object. When you write alert(...) or document.title with no prefix, property lookup on window is what finds them — the same lookup from Lesson 1, because window is an object with a prototype chain like everything else.

The circular world, verified live

The window graph is deliberately full of cycles so that any object can reach any other. All of these just ran in your browser:

How your variables land on window (or don't)

The script on this page declared, at the top level of a classic <script>:

var demoVar = "I am on window";
let demoLet = "I am not";
function demoFunction() {}
window.demoAssigned = "explicit is clearest";

Inside ES modules (type="module") even var and function declarations stay in module scope — nothing leaks onto window.

The objects hanging off window

Historically called the Browser Object Model: services the browser gives you that are not part of the document. Each card shows the object's class and live values read just now.

window's own prototype chain

Even the global object obeys Lesson 1. Notice EventTarget.prototype in the chain — that is why window.addEventListener("resize", ...) works: the same method your button inherits, from the same prototype object.

Putting the whole picture together

Structure (tree links)

window
 └─ document
     └─ document.documentElement   <html>
         ├─ document.head
         └─ document.body
             └─ ...every node on the page

Behavior (prototype links)

window     → Window.prototype    → ... → EventTarget.prototype
document   → Document.prototype  → Node.prototype → EventTarget.prototype
button     → HTMLButtonElement.prototype → ... → EventTarget.prototype

everything → ... → Object.prototype → null

The whole model in three sentences. Every browser object is a plain JavaScript object whose behavior comes from a chain of shared prototype objects, looked up property by property. DOM nodes additionally point at each other with tree links that describe the current shape of the page. And all of it is reachable from one global object, window, which is itself just another object with a prototype chain.