BOM

BOM的概念是Browser Object Model的三个单词的首拼，意思为浏览器对象模型。
BOM中最大的对象是window，是浏览器窗口对象。

window对象的方法

浏览器信息

window.navigator.appCodeName
返回浏览器的代码名，返回浏览器的内核。
window.navigator.appName
返回浏览器的额名称。
window.navigator.appVersion
返回浏览器的版本信息。
window.navigator.userAgent
返回由客户机发送服务器的user-agent头部的值

使用说明：其实navigator对象是属于window对象的，但是window是所有对象的顶级对象，所以通常在写的时候，可以省略掉window。

浏览器操作历史记录

历史记录的操作是window的子对象history。可以操作网页的前进和后退。

history.back()
返回上一个网页。
history.forward
前进到下一个网页。
history.go()
前进几个网页就写正数几，后退就写负数几。

浏览器操作地址栏信息（重要）

浏览器的地址栏操作，window对象交给了自己的子对象location对象去处理。

location.href
用于获取或者设置完整的地址，可以用于设置跳转页面。
location.hash
用于获取地址栏中的锚点
location.search
用于获取地址栏中的数据，可以用于添加数据。
location.assign('要跳转的地址')
设置要跳转的地址
location.reload()
重新加载这个页面
location.replace('新的地址')
用新的地址替换掉旧的地址

浏览器的窗口尺寸

window.innerHeight
浏览器窗口的高度
window.innerWidth
浏览器窗口的宽度

说明：

这两个属性返回的单位是像素
这两个属性计算的范围包含滚动条的区域

浏览器事件

window.onload
当网页中的所有资源都加在完成之后执行这个事件
window.onscroll
当网页滚动条的位置发生改变的时候触发这个事件
window.onresize
当浏览区窗口大小改变时触发事件

浏览器定时器

延迟执行

var timerId = setTimeout(function () {
  console.log('我执行了')
}, 1000)
console.log(timerId) // 1

表示延迟1000毫秒执行console.log（'我执行了'）

使用说明：第一个参数是要执行的函数，第二个参数延迟的时间（单位毫秒）。返回一个数字，表示当前页面中第几个定时器。

每间隔一段时间执行

var timerId = setInterval(function () {
  console.log('我执行了')
}, 1000)

使用说明：第一个参数是要执行的函数，第二个参数是间隔的时间（单位毫秒）。返回一个数字，表示当前页面中第几个定时器。

定时器返回的数字，就是用来关闭定时器的

clearTimeout(timerId); // 关闭延迟执行的定时器
clearInterval(timerId); // 关闭间隔执行的定时器

两个关闭的方法可以混合使用。这两个代码都属于异步代码。

异步代码

我们平常写的代码都是同步代码，定时器我们接触到的第一个异步代码。

js的特点是单线程的，也就是同一时间只能做一件事情，所以js会将异步代码交给浏览器去处理，因为浏览器是多线程的。

js的线程，会先将所有同步代码执行完，与此同时，浏览器也在处理异步代码(例如正在等待时间)，当浏览器中的异步代码到了应该执行的时候了，会将需要执行的异步代码放在一个队列中，进行排队等候；当js线程将所有同步代码执行结束后，会从队列中拿出第一个需要执行的代码去执行，执行过一个以后，再次到队列中拿出第二个需要执行的代码去执行。。。。

js的异步操作，是在所有同步代码执行完成以后才执行异步代码

一般情况代码是按顺序执行的，上一行代码执行结束之前，下一行代码一直在等待，这是同步机制

JavaScript-BOM