Web APIs六---BOM

1.window对象

在全局作用域下声明的函数属于window对象

function fn() {
    console.log('测试函数')
}
window.fn()

使用var 关键字在全局作用域下声明的变量也是属于window对象

var num = 10
console.log(window.num)

2.延时器setTimeout

setTimeout 仅仅只执行一次，平时省略window
开启延时器:

let timerId = setTimeout(function () {
    console.log('真的延时执行了吗？')
}, 1000)

关闭延时器:

clearTimeout(timerId)

3.常见异步任务

注册事件
setTimeout setInterval
Ajax
promise

4.事件循环 EventLoop

1.同步任务由 JavaScript 主线程依次来执行
2.异步任务委托给宿主环境（浏览器）执行
3.已完成的异步任务对应的回调函数，会被加入到任务队列中等待执行
4.JavaScript 主线程的执行栈被清空后，会读取任务队列中的回调函数
5.按次序执行 JavaScript 主线程不断重复上面的第 4 步

5.location对象

href属性得到完整url地址

console.log(location.href)

设置href属性值，进行页面跳转

location.href = 'https://www.jianshu.com/'

search 属性获取查询字符串，符号?及?后面部分
hash 属性获取哈希值，符号 # 及 # 后面部分
reload 方法用于刷新页面

6.navigator对象

通过 userAgent 属性检测浏览器的版本及平台

// 检测 userAgent（浏览器信息）
(function () {
    const userAgent = navigator.userAgent
    // 验证是否为Android或iPhone
    const android = userAgent.match(/(Android);?[\s\/]+([\d.]+)?/)
    const iphone = userAgent.match(/(iPhone\sOS)\s([\d_]+)/)
    if (android || iphone) {
        // 如果是Android或iPhone，则跳转至移动站点
         location.href = 'http://www.itcast.cn'
     }
})()

7.histroy对象

history.back() 后退一个历史记录
history.forward() 前进一个历史记录
history.go(0) 刷新页面
history.go(3) 前进3个历史记录
history.go(-3) 后退3个历史记录
history.go(300) undefined 不生效

8.本地存储

数据存储在用户浏览器中
只能存字符串
生命周期永久生效
页面刷新页面关闭不丢失数据

存储数据：localStorage.setItem('键', '值') 同键名有覆盖效果
获取数据：localStorage.getItem('键')
删除数据：localStorage.removeItem('键')

复杂数据类型需转成JSON字符串,再存储到本地

//把js复杂数据字符串化得到 JSON字符串,再本地存储
localStorage.setItem('data', JSON.stringify(obj))

//先取出本地存储的JSON字符串,再将JSON字符串解析成JS的复杂数据
JSON.parse(localStorage.getItem('data'))

sessionStorage和 localStorage用法一样
生命周期为关闭浏览器窗口

9.自定义属性

操作自定义属性的方法了解即可
1.元素.getAttribute('属性名')
2.元素.setAttribute('属性名', '值')
3.元素.removeAttribute('属性名')

规范自定义做法：
在标签上使用data-* 来表示自定义属性
在JS操作的时候，通过元素.dataset 来进行操作，返回一个对象

<div data-index="1" data-id="2" >哈哈</div>

let box = document.querySelector('#box')
console.log(box.dataset)           //{index: '1', id: '2'}
console.log(box.dataset.index)     // 1