WINDOW, DOCUMENT and SCREEN in JavaScript

Window

1. The Window object sits at the top of the JavaScript Object hierarchy and represents the browser window.
2. The window object represents the current browsing context . It holds things like window.location, window.history, window.screen, window.status, or the window.document .
3. The window is the first thing that gets loaded into the browser and each browser tab has its own top-level window object.
4. Also the window property of a window object points to the window object itself. So, all the following statements points to the same window object:
   window.window
   window.window.window
   … so on

Document

1. The Document interface represents any web page loaded in the browser and serves as an entry point into the web page’s content, which is the DOM tree.
2. When an HTML document is loaded into a web browser , it becomes a document object which is the root node of the HTML document.
3. The document actually gets loaded inside the window object and has properties available to it like title, URL, cookie, etc.
4. HTML documents, served with the “text/html” content type, also implement the HTMLDocument interface.
5. The document property can be accessed in below two ways
   document
   window.document
   As document loads after the window object object is loaded, it sits inside window object.

Screen

1. Screen is a small information object about physical screen dimensions .
2. It can be used to display screen width, height, colorDepth, pixelDepth etc.
3. Screen comes inside window object but its not always mandatory to write window prefix with screen object.
4. Some of the property of screen object contains:
   screen.width
   screen.height

Hope you guys find it useful.
Happy learning!