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

Window:-

The window is the first thing that gets loaded into the browser. In JavaScript window object sits at the top of the JavaScript Object hierarchy and represents the browser window. The window consist of number of objects in it as properties and DOCUMENT and SCREEN are one of the objects in Window among all. The window has other properties like length, inner Width, inner Height, name, if it has been closed, its parents, and more.

Image showing Window in top and other properties under window like Document.

DOCUMENT:-

When we enter a url in search bar like Ex.google.com and press enter, in the window object it loads Document. DOCUMENT is the content of the page i.e HTML, aspx, php,xml or other document that will be loaded into the browser and get converted to the DOM object [Document Object Model]. It gets loaded inside the window objects. When a web page is loaded, the browser creates a Document Object Model of the page.

SCREEN:-
Screen is an another property of WINDOW contains content about the users screen. It can be used to display screen width, height etc.

Properties
screen.width
screen.height
screen.availWidth
screen.availHeight