目录
BOM简介什么是BOMDOM和BOM的区别BOM的构成 Window对象的常见事件窗口加载事件调整窗口大小事件 定时器函数setTimeout( )定时器停止setTimeout( )定时器setInterval( )定时器停止setInterval( )定时器 js执行机制js是单线程同步和异步同步任务和异步任务js执行机制 location对象什么是location对象URLlocation对象的属性location对象的方法 navigator对象navigator常用属性navigator常用方法 history对象history常用属性history常用方法BOM简介
什么是BOM
BOM（Browser Object Model）：浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是window。
BOM由一系列相关的对象构成，并且每个对象都提供了很多方法和属性。
BOM缺乏标准，JavaScript语法的标准化组织是ECMA，DOM的标准化组织是W3C，BOM最初是Netscape浏览器标准的一部分。
DOM和BOM的区别
DOM：
文档对象模型DOM就是把文档当作一个对象来看待DOM的顶级对象是documentDOM主要是操作页面元素DOM是W3C标准规范
BOM：
浏览器对象模型把浏览器当作一个对象看待BOM的顶级对象是windowBOM主要是浏览器窗口交互的一些对象BOM是浏览器厂商在各自浏览器上定义的，兼容性较差
BOM的构成
BOM比DOM大，包括DOMwindow对象是浏览器的顶级对象，一方面，它是js访问浏览器窗口的一个接口；另一方面，它是一个全局对象，定义在全局作用域中的变量、函数都会变成window对象的属性和方法。
在调用时可以省略window。
Window对象的常见事件
窗口加载事件
window.onload事件：是窗口（页面）加载事件，当文档内容（包括图像、脚本文件、CSS文件等）完全加载完成会触发该事件。window.onload = function() {} window.addEventListener('load',function() {})
有了window.onload就可以把js代码写到页面元素的上方，因为onload是等页面内容全部加载完毕，再去执行处理函数document.DOMContentLoaded加载事件，会在DOM加载完成时触发，这里所说的加载不包括CSS样式表、图片和flash动画等额外内容的加载。
document.addEventListener('DOMContentLoaded',fuction() {})
如果页面的图片很多的话，从用户访问到onload触发可能需要较长的时间，交互效果就不能实现，必然影响用户的体验，此时用DOMContentLoaded事件比较合适
le9以上才支持
调整窗口大小事件
window.onresize：当浏览器窗口大小发生改变时触发该事件。
window.onresize = function() {}window.addEventListener('resize',function() {})
只要窗口大小发生像素变化，就会触发这个事件我们经常利用这个事件完成响应式布局
定时器函数
window对象为我们提供了两个非常友好的方法：setTimeout、setInterval。
setTimeout( )定时器
setTimeout：在给定的时间（以毫秒为单位）之后，执行函数，返回值是一个定时器对象。
window.setTimeout(function() {},时间)
window可以省略延迟的毫秒数省略默认为0，如果写必须是毫秒因为定时器可能有很多，我们经常给定时器赋值一个标识符setTimeout( )这个调用函数也称为回调函数callback
停止setTimeout( )定时器
clearTimeout：清除setTimeout定时器对象。
window.clearTimeout(定时器对象)
setInterval( )定时器
setInterval方法重复调用一个函数，每隔这个时间，就会调用一次回调函数。
window.setInterval(function() {},时间)
以毫秒为单位
停止setInterval( )定时器
clearInterval方法取消了先前通过调用setInterval( )建立的定时器。
window.clearInterval(定时器对象)
js执行机制
js是单线程
JavaScript的一个特点是单线程，也就是说，同一个时间只能做一件事。
这是因为JavaScript这门脚本语言诞生的使命所致，JavaScript是为处理页面中用户的交互以及操作DOM而诞生的。
单线程也就意味着，所有任务需要排队，前一个任务结束，才会执行后一个任务。
这样导致的问题是，如果js执行的时间过长，这样就会造成页面的渲染不连贯，导致页面渲染加载阻塞的感觉。
进程：程序的一次动态运行，有独立的内存空间
线程：是进程的运行单位，一个进程可以分为若干个线程
同步和异步
为了解决这个问题，利用多核CPU的计算能力，HTML5提出Web Worker标准，允许JavaScript脚本创建多个线程。
于是，js中出现了同步和异步。
同步：前一个任务结束后再执行后一个任务，程序的执行顺序与任务的排列顺序是一致的、同步的。
异步：在做一件事情的同时去做其他的事情。
区别：执行顺序不同。
同步任务和异步任务
同步任务：同步任务都在主线程上执行，形成一个执行栈。
异步任务：js的异步是通过回调函数实现的， 异步任务相关回调函数添加到任务队列中（任务队列也称为消息队列）。
一般而言，异步任务有以下三种类型：
普通事件，如click，resize等资源加载，如load，error等定时器，包括setInterval、setTimeout等
js执行机制
先执行执行栈中的同步任务异步任务（回调函数）放入任务队列中一旦执行栈中的所有同步任务执行完毕，系统就会按次序读取任务队列中的异步任务，于是被读取的异步任务结束等待状态，进入执行栈，开始执行console.log(1)document.onclick = function() {console.log('click')}console.log(2)setTimeout(function() {console.log(3)},3000)//执行结果：1 2 3 click 或 1 2 click 3
执行机制示意图：
由于主线程不断的重复获得任务、执行任务、再获取任务、再执行，所以这种机制被称为事件循环（event loop）。
location对象
什么是location对象
window对象给我们提供了一个location属性用于获取或设置窗体的url，并且可以用于解析url。
因为这个属性返回的是一个对象，所以我们将这个属性也称为location对象。
URL
统一资源定位符（Uniform Resource Locator，URL）是互联网上标准资源的地址，互联网上的每个文件都有一个唯一的URL，它包含的信息指出文件的位置以及浏览器应该怎么处理它。
URL的一般语法格式：
protocol://host[:port]/path/[?query]#fragment
/index.html?name=andy&age=19#link
protocol：网络协议(http、ftp、mailto等)host：主机（即服务器名），例如：本地机的ip是127.0.0.1，或 localhostport：端口，65535个，0-1023：由系统使用；1024-65535：用户使用path：路径，若文件的位置：users/index.htmlquery：参数，以键值对的形式表示，参数之间用‘&’分隔，参数和地址之间用’?'分隔
location对象的属性
location对象的方法
navigator对象
navigator常用属性
navigator对象包含有关浏览器的信息，它有很多属性，我们最常用的是userAgent，该属性可以返回由客户机发送服务器的user-agent头部的值。
navigator常用方法
javaEnabled( ):指定是否在浏览器中启用java。
history对象
window对象给我们提供了一个history对象，与浏览器历史记录进行交互。
该对象包含用户（在浏览器窗口中）访问过的URL。
history常用属性
history.length：返回历史列表中的网址数
