当前位置：首页 > news >正文

17.1 Wiindow对象

news 2026/8/2 19:34:11

17.1 BOM

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

●window对象是一个全局对象，也可以说是JavaScript中的顶级对象
●像document、alert()、 console. log()这些都是window的属性，基本BOM的属性和方法都是window的
●所有通过var定义在全局作用域中的变量、函数都会变成window对象的属性和方法
●window对象下的属性和方法调用的时候可以省略window

17.2 定时器-延时函数

●setTimeout是JavaScript内置的一个用来让代码延迟执行的函数
●语法:

setTimeout(回调函数,等待的毫秒数)

●setTimeout只执行一次，所以可以理解为就是把一段代码延迟执行，平时省略window
●清除延时函数:

let timer = setTimeout(回调函数,等待的毫秒数) clearTimeout(timer)

●注意
延时器需要等待，所以后面的代码先执行
每一次调用延时器都会产生一个新的延时器

●两种定时器对比：执行的次数
延时函数: 执行一次
间歇函数：每隔一段时间就执行一次，除非手动清除

17.3 JS执行机制

JavaScript语言的一大特点就是单线程，也就是说，同一个时间只能做一件事。
这是因为Javascript这门脚本语言是为处理页面中用户的交互，以及操作DOM而诞生的。比如我们对某个DOM元素进行添加和删除操作，不能同时进行。应该先进行添加，之后再删除。

单线程就意味着，所有任务需要排队，前一个任务结束，才会执行后一个任务。这样所导致的问题是：如果JS执行的时间过长，这样就会造成页面的渲染不连贯，导致页面渲染加载阻塞的感觉。

为了解决这个问题， JS中出现了同步和异步
同步
前一个任务结束后再执行后一个任务，程序的执行顺序与任务的排列顺序是一致的、同步的
异步
你在做一件事情时，因为这件事情会花费很长时间，在做这件事的同时，你还可以去处理其他事情
他们的本质区别：这条流水线上各个流程的执行顺序不同

执行次序：
1.先执行执行栈中的同步任务
2.异步任务放入任务队列中
3.一旦执行栈中的所有同步任务执行完毕，系统就会按次序读取任务队列中的异步任务，于是被读取的异步任务结束等待状态，进入执行栈，开始执行

17.4 location对象

location 的数据类型是对象，它拆分并保存了URL地址的各个组成部分
常用属性和方法：
●href属性获取完整的URL地址，对其赋值时用于地址的跳转（重点）

//可以得到当前文件URL地址 console.log( location.href) //可以通过js方式跳转到目标地址 location.href = 'http: //www.itcast.cn '

●search 属性获取地址中携带的参数，符号?后面部分

console.log( location.search)

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

console.log( location.hash)

后期vue路由的铺垫，经常用于不刷新页面，显示不同页面，比如网易云音乐

●reload 方法用来刷新当前页面，传入参数true时表示强制刷新

< button>点击刷新< / button><script>letbtn=document.querySelector('button')btn.addEventListener('click',function(){location.reload(true)// 强制刷新 类似ctrL + f5})</script>

17.5 navigator对象

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_]+)/) //如果是Android或iPhone,则跳转至移动站点 if (android || iphone) { location.href = 'http://m.itcast.cn' } })()

立即执行函数也可这么写：