[前端笔记021]JavaScript之BOM、定时器、调用栈和消息队列

资源

• 推荐zeal:离线文档查看器 https://zealdocs.org/
• 推荐w3c:线上文档 https://www.w3school.com.cn/
• 本笔记参考视频，李立超:BV1mG411h7aD p161-p181
• 我的笔记：https://gitee.com/plusmile/stackedit-app-data.git

BOM简介

• 浏览器对象模型，BOM提供了一组对象，可以对浏览器进行各种操作
• BOM对象有：
  1. Window，浏览器窗口，全局对象
  2. Navigator，浏览器的对象，识别浏览器种类(navigator.userAgent)，用户位置信息，硬件信息等。
  3. Location，浏览器地址栏信息；可以将location的值修改为新的地址，这样会使网页发生跳转。location.href，读取地址栏完整地址；location.protocol，网址协议；。。。方法有，location.assign()，跳转到新的地址；location.replace()，跳转到新的地址，无法通过回退按钮回退；location.reload()，刷新页面，可以传递一个true来使刷新时强制清空缓存
  4. History，浏览器历史记录，主要是前进后退；常用方法，history.back()，回退按钮；history.forward()，前进按钮；history.go()，正值向前跳转，负值向后跳转，根据绝对值计算跳转多少步。
  5. Screen，用户的屏幕信息，像素，大小等
• BOM对象都是作为window对象的属性保存的，可以直接在JS中对上述对象进行访问，首字母小写

定时器

• 设置定时器的两种方式：
• setTimeout()，定时一次，参数：1.回调函数；2.间隔的时间，单位毫秒；关闭方法，clearTimeout()，参数使用setTimeout()返回的标识
• setInterval()，循环定时，参数：1.回调函数；2.间隔的时间，单位毫秒；关闭方法，clearInterval()，参数使用setInterval()返回的标识，
• 定时器的本质是在指定时间后将函数添加到消息队列中
• setInterval()，有一个问题是，如果函数执行的较慢，就无法保证稳定的时间间隔，可以使用setTimeout中递归调用回调函数的方法，模拟循环定时，并保证时间间隔。

事件循环

• 函数每次执行时，会产生一个执行环境，执行环境存储函数执行时产生的一切数据，执行环境存储在函数的调用栈中
• 消息队列，消息队列负责存储将要执行的函数，当调用栈中的函数执行完毕后，才将消息队列中的函数压入调用栈中