JavaScript screen object properties

In JavaScript, the BOM (Browser Object Model) refers to a collection of objects provided by the browser for managing browser windows and documents. Among them, the screen object is one within the BOM that provides information about the user's screen.

The screen object contains numerous properties through which you can retrieve details such as the width and height of the user's screen, pixel density, and more. Below are some common properties of the screen object:

  • screen.width: Returns the width of the user's screen (in pixels).
  • screen.height: Returns the height of the user's screen (in pixels).
  • screen.availWidth: Returns the available width of the user's screen (excluding non-work areas such as the operating system taskbar).
  • screen.availHeight: Returns the available height of the user's screen (excluding non-work areas such as the operating system taskbar).
  • screen.pixelDepth: Returns the color depth of the user's screen (in bits).
  • screen.colorDepth: Returns the color depth of the user's screen (in bits).

In addition to the properties listed above, the screen object provides other attributes. For example, screen.orientation is used to retrieve device orientation information and more.

It should be noted that the information provided by the screen object may not be accurate due to user settings or browser limitations; therefore, it needs to be used cautiously in actual development projects.