本文已参与「新人创作礼」活动， 一起开启掘金创作之路。

BOM（浏览器对象模型）

BOM

BOM(Browser Object Model ) 是浏览器对象模型

window对象是一个全局对象，也可以说是JavaScript中的顶级对象

像document、alert()、console.log()这些都是window的属性，基本BOM的属性和方法都是window的

所有通过var定义在全局作用域中的变量、函数都会变成window对象的属性和方法

window对象下的属性和方法调用的时候可以省略window

定时器-延时函数

setTimeout：内置的一个用来让代码延迟执行的函数，传入两个参数，第一个参数传入要被延时执行 的函数，第二个传入延时的时间（单位是ms）

<script>
       let timer = setTimeout(function(){
          console.log('555');
        },3000);
        console.log('接下来有请');
        //在此代码中，控制台会先打印'接下来有请' ,然后等3s后打印 '555'
        //clearTimeout(timer);
  </script>

location对象

location 的数据类型是对象，它拆分并保存了 URL 地址的各个组成部分

location.href 属性获取完整的 URL 地址，对其赋值时用于地址的跳转

location.hash 属性获取地址值中的哈希值，符号#后面的部分

location.search 属性获取地址值中携带的参数 '?uname = admin'

location.reload() 方法用来刷新当前页面 相当于点击了一次刷新按钮(alt+F5)

navigator对象

lnavigator的数据类型是对象，该对象下记录了浏览器自身的相关信息

常用属性和方法：

通过 userAgent检测浏览器的版本及平台(需要用时直接cv大法，不用特意记)

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

histroy对象

history 的数据类型是对象，主要管理历史记录， 该对象与浏览器地址栏的操作相对应，如前进、后退、历史记录等

history.back()后退，相当于 history.go(-1);

history.forward()前进，相当于 history.go(1);

history.go()到历史记录的哪一个(括号里面填具体数字);

screen对象

screen 对象记录了浏览器窗口的一些数据，可以用来检测窗口变化==

比如screen.width可以获取当前浏览器的屏幕宽度