快速了解JavaScript的BOM模型

ECMAScript是JavaScript的核心,而BOM(浏览器对象模型,Browser Object Model)是在Web中使用JavaScript的核心。

BOM对象中,window对象是最顶层对象,在浏览器环境中它是一个Global全局对象,其它对象是window对象的子对象(属性)。BOM主要用于管理浏览器窗口及窗口之间的通讯。下面是BOM对象的组成结构。

BOM浏览器对象模型.png

window对象

windowBOM的核心对象,表示浏览器的一个实例。有双重角色,即是通过JavaScript访问浏览器窗口的一个接口,又是ES规定的Global对象。这意味着在网页中定义的任何一个对象、变量和函数,都以window作为其Global对象。

var age = 29;
function sayAge() {
    console.log(this.age);
}
console.log(window.age);    // 29
sayAge();                   // 29
window.sayAge();            // 29

如上所示,在全局作用域中定义的变量和函数都被自动归在了window对象名下。而sayAge()存在于全局作用域中,方法中的this.age被映射到window.age,因此显示的仍然是正确的结果。

然而,定义的全局变量不能通过delete操作符删除,定义在window对象上的属性却可以。

window除了locationnavigatorscreenhistorydocument外,还有一些属性。

  • window.console:返回Console对象的引用,可以向浏览器控制台输出日志信息。仅用于调试,不应该给用户呈现。(只读)
  • window.frames:数组对象,列出当前窗口的所有直接子窗口。(只读)
  • window.frameElement:当前窗口嵌入另一个窗口(嵌入