X.png)
进程与线程
进程
程序的一次执行，占有一片独立的内存空间，可以通过windows任务管理器查看进程
线程
是进程内的一个独立执行单元，是程序执行的一个完整流程，是cpu的最小的调度单元
应用程序必须运行在某个进程的某个线程中
一个进程中至少有一个运行的线程：主线程，进程启动后自动创建
一个进程中也可以同时运行多个线程，我们会说程序是多线程运行的
一个进程内的数据可以供其中的多个线程直接共享
多个进程之间的数据是不能直接共享的
线程池：保存多个线程对象的容器，实现线程对象的反复利用
相关问题
多程序运行：一个应用程序可以同时启动多个实例运行
多线程：在一个进程内，同时有多个线程运行
多线程优点：有效提升cpu使用率。缺点：创建多线程开销，线程间切换开销，死锁与状态同步问题
单线程优点：顺序编程简单易懂。缺点：效率低
js是单线程运行的，但使用H5的Web Workers可以多线程运行。
浏览器内核
浏览器内核是支撑浏览器运行的最核心的程序，不同浏览器可能不一样
内核中有很多模块
主线程包括js引擎模块，html、css文档解析模块，DOM/CSS模块，布局和渲染模块等等
分线程包括定时器模块，事件响应模块，网络请求模块等等
定时器
定时器并不能保证真正定时执行，一般会延迟一点(可以接受)，也有可能延迟很长时间(不能接受)
原因：定时器在主线程执行的，js是单线程的，事件循环模型。
setTimeout()的回调函数是主线程执行的
定时器回调函数只有在运行栈中的代码全部执行完才有可能执行
js的单线程和它的用途有关，代码分为初始化代码和回调代码
js的执行流程
先执行初始化代码：包含一些特别的代码
设置定时器==>绑定事件监听==>发送ajax请求
后面在某个时刻才会执行回调代码
事件循环模型
1.初始化代码分类
初始化执行代码：包含绑定dom事件监听，设置定时器，发送ajax请求
回调执行代码(异步代码)：处理回调逻辑
2.js引擎执行代码的基本流程
初始化代码==>回调代码
3.模型的2个重要组成部分
事件管理模块，回调队列
4.模型的运转流程
执行初始化代码，将事件回调函数交给对应模块管理
当时间发生时，管理模块会将回调函数添加到回调队列中
只有当初始化代码执行完后(可能要一定时间)，才会便利读取回调队列中的回调函数执行
H5 Web Workers
H5规范提供了js分线程的实现，取名为Web Workers，可以将一些大计算量的代码交给Web Worker运行而不冻结用户界面
但是子线程完全受主线程控制，且不操作DOM。所以，这个标准并没有改变js单线程的本质
使用
创建在分线程执行的js文件
在主线程中的js中发消息并设置回调
function fibonacci(n){
return n<=2?1:fibonacci(n-1)+fibonacci(n-2)
}
var onmessage=function(event){//不能用函数声明
var number=event.data
console.log('接收到数据')
//计算
var result =fibonacci(number)
postMessage(result)
console.log('返回数据'+result)
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<input type="text" id="number" placeholder="数值">
<button id="btn">计算</button>
<script type="text/javascript">
//斐波那契数列
var input=document.getElementById('number')
document.getElementById('btn').onclick=function(){
var number=input.value
//创建一个Worker对象
var worker= new Worker('./2.js')
//绑定接受信息的监听
worker.onmessage=function(event){
console.log('接收返回的数据'+event.data)
alert(event.data)
}
//向分线程发送消息
worker.postMessage(number)
console.log('发送数据'+number)
}
</script>
</body>
</html>
问题
不是所有浏览器都支持，worker内代码不能访问DOM，不能跨区域加载JS
Q.E.D.