What is the difference between window, screen, and document in JavaScript?

Sarveshlal
1 min readDec 4, 2020

Window

The JavaScript window object sits at the top of the JavaScript Object hierarchy and represents the browser window.All global JavaScript objects , functions, and variables automatically become members of the window object.The window is the first thing that gets loaded into the browser . This window object has the majority of the properties like length, innerWidth, innerHeight, name, if it has been closed, its parents, and more.

It holds things like window.location, window.history, window.screen, window.status, or the window.document .

Document

It is the direct child of the window object. It is also known as Document Object Model (DOM). Document object has many useful methods defined on it.

  • For example, document.getElementById(), document.getElementByTagName(), document.createElement(), document.querySelector()

Document is the actual content of the page i.e the html page you are loading is converted to the DOM object.The HTML DOM will be created as TREE MODEL

Screen

Screen is a small information object about physical screen dimensions.It can be used to display screen width, height, colorDepth, pixelDepth etc. It is not mandatory to write window prefix with screen object.

--

--