事件循环（轮询）模型
模型的2个重要组成部分
- 事件管理模块
- 回调队列（callback queue） 缓存作用
callback queue 里面是待执行，等初始化代码全部执行完毕才会依次循环遍历执行callback queue里的回调函数（单线程） ！即定时器到了时间或一些DOM事情响应后将调用回调函数放进callback queue，并没有执行！所以定时器有延迟
相关重要概念
- 执行栈（execution stack）：所有代码都是在此空间中执行
- 浏览器内核（browser core）：js引擎模块（在主线程处理），其他模块（在主/分线程处理）
- callback queue：任务队列、消息队列、事件队列
- 事件轮询（event loop）：从任务队列中循环取出回调函数放入执行栈中处理（依次）
- 事件驱动模型：event-driven interaction model 上图所有
- 请求响应模型：request-response model 浏览器与服务器交互
H5 Web Workers（多线程）
主要作用：将一些大计算量的代码（如斐波拉契数列技术，递归）交由web Worker运行（分线程）而不需冻结用户界面，但子线程完全受主线程控制，且不得操作DOM（只能主线程操作DOM），因而也没有从根本上改变js单线程的本质。
-
相关API
- Worker：构造函数，加载分线程执行的js文件
- Worker.prototype.onmessage：用于接收另一个分线程的回调函数
- Worker.prototype.postMessage：向另一个分线程发送消息
-
不足
- 慢，并没有加快计算速度，至少不堵塞主线程
- worker内代码不能操作DOM（不能更新UI，需要window/document的方法），分线程内无window全局对象！
- 不能跨域加载JS
- 不是每个浏览器都支持这个新特性
使用
- 在分线程中创建js执行文件
- 在主线程中的js中发送消息并设置回调
<html>
<body>
<input type = "text" placeHolder="数值" id="number">
<button id="btn">计算</button>
<srcipt type="text/javascript">
// 1 1 2 3 5 8 f(n) = f(n-1)+f(n-2)
var input = document.getElementById("number")
document.getElementById("btn").onclick = function () {
var number = input.value
//创建一个worker对象
var worker = new Worker("worker.js")
//绑定接受消息监听 回调代码
worker.onmessage = function (event){
console.log("主线程接受分线程返回的数据："+event.data)
alert(event.data)
}
//向分线程发送消息 初始化代码
worker.postMessage(number)
console.log("主线程向分线程发送数据："+number)
}
</srcipt>
</body>
</html>
worker的this不是window，是自己的，alert就没有
