JavaScript中的浏览器对象有哪些？为何需引用window调用它们？

一、常见的浏览器对象有哪些？ #

浏览器为JavaScript提供的宿主对象（即浏览器对象）主要包括：

• window：全局顶级对象，是所有浏览器对象的宿主
• document：DOM文档对象，用于操作页面的HTML内容
• location：管理当前页面的URL信息，可实现跳转、修改地址等操作
• navigator：提供浏览器及运行环境的详情，比如浏览器类型、版本、设备的系统信息
• screen：获取用户屏幕的参数，比如分辨率、像素密度
• history：操作浏览器的会话历史，比如前进、后退
• 还有localStorage/sessionStorage（本地存储）、console（控制台工具）、fetch/XMLHttpRequest（网络请求）这类实用的浏览器对象

二、调用location、document时为何要引用window？ #

其实大多数时候不用特意写window.前缀——因为window是全局作用域的顶级对象，所有全局的浏览器对象默认都是window的属性，在全局作用域下直接写document、location就等价于window.document、window.location。

但如果在局部作用域里定义了同名变量，就必须加window.来区分，避免混淆：

function demo() {
  const document = '我是局部变量';
  console.log(document); // 输出"我是局部变量"
  console.log(window.document); // 输出真正的DOM文档对象
}

三、浏览器对象、window对象的区别，以及document的归属 #

• window对象：是浏览器提供的全局顶级对象，它本身就属于浏览器对象的核心，同时它把绝大多数其他浏览器对象都作为自己的属性来管理。
• 浏览器对象：是浏览器给JavaScript提供的所有宿主对象的统称——包括window本身，以及它旗下的document、location等所有子对象。
• document是window对象的属性，准确写法是window.document，它专门负责处理页面的DOM相关操作，是window下的核心子对象之一。

内容的提问来源于stack exchange，提问作者Shweta