本文主要是介绍进程和线程 以及 JavaScript 执行栈,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
进程和线程
进程(process): 程序的一次执行,它占有一片独有的内存空间,可以通过windows任务管理器查看进程。
![在这里插入图片描述](/upload/202105/05/202105050729028077.png)
线程(thread):是进程内的一个独立执行单元,是程序执行的一个完整流程是CPU的最小的调度单元。
![在这里插入图片描述](/upload/202105/05/202105050729037935.png)
- 应用程序必须运行在某个进程的某个线程上
- 一个进程中至少有一个运行的线程:主线程,进程启动后自动创建
- 一个进程中也可以同时运行多个线程,我们会说程序是多线程运行的
- 一个进程内的数据可以供其中的多个线程直接共享
- 多个进程之间的数据是不能直接共享的
- 线程池(thread pool):保存多个线程对象的容器,实现线程对象的反复利用
- 多进程运行:一应用程序可以同时启动多个实例运行
- 何为多进程与多线程? 多线程:在一个进程内,同时有多个线程运行
比较单线程与多线程
- 多线程
优点
:能有效提升CPU的利用率。
缺点
:
创建多线程开销
线程间切换开销
死锁与状态同步问题 - 单线程
优点
:顺序编程简单易懂
缺点
:效率低
JS是单线程还是多线程?
js是单线程运行的
,但使用H5中的Web Workers可以多线程运行。
浏览器
运行是单线程还是多线程? 都是多线程
运行的。
浏览器运行是单进程还是多进程?
- 有的是单进程:firefox、老版IE
- 有的是多进程:chrome、新版IE
- 如何查看浏览器是否是多进程运行的呢?
![在这里插入图片描述](/upload/202105/05/202105050729044966.png)
浏览器内核
-
浏览器内核:支撑浏览器运行的最核心的程序
-
不同的浏览器可能不一样
Chrome, Safari:webkit
firefox:Gecko
IE:Trident
360,搜狗等国内浏览器:Trident + webkit
-
内核由很多模块组成
主线程:
js 引擎模块:负责 js 程序的编译与运行
html,css 文档解析模块:负责页面文本的解析
DOM/CSS 模块:负责 dom/css 在内存中的相关处理
布局和渲染模块:负责页面的布局和效果的绘制(内存中的对象)
……
分线程:
定时器模块:负责定时器的管理
事件响应模块:负责事件的管理
网络请求模块:负责 ajax 请求
思考 ~
- 定时器真是定时执行的吗?
定时器并不能保证真正定时执行
一般会延迟一丁点(可以接受),也有可能延迟很长时间(不能接受) - 定时器回调函数是在分线程执行的吗?
在主线程执行的,js是单线程的 - 定时器是如何实现的?
事件循环模型
document.getElementById('btn').onclick = function() {
var start = Date.now()
console.1og('启动定时器前...')
setTimeout(function () {
console.log('定时器执行了',Date.now( )-start)
}.200)
console.log('启动定时器后...")
// 做一个长时间的工作
for (var i = 0; i < 1000000000; i++) {
}
}
- 如何证明js执行是单线程的?
setTimeout()
的回调函数是在主线程
执行的。
定时器回调函数只有在运行栈
中的代码
全部执行完
后才有可能执行。 - 为什么js要用单线程模式,而不用多线程模式?
Javascript的单线程,与它的用途有关。
作为浏览器脚本语言,Javascript的主要用途是与用户互动,以及操作DOM。
这决定了它只能是单线程,否则会带来很复杂的同步问题。 - 代码的分类:
初始化代码回调代码 - js引擎执行代码的基本流程
先执行初始化代码:包含一些特别的代码
设置定时器
绑定监听
发送 ajax 请求
后面在某个时刻才会执行回调代码
setTimeout(function () {
console.log( 'timeout 2222')
alert( '22222222')
},2000)
setTimeout(function() {
console.1og('timeout 1111')
alert('1111114')
}, 1000)
function fn() {
console.log('fn()')
}
fn()
console.log('alert()之前')
alert('------') // 暂停当前主线程的执行,同时暂停计时,点击确定后,恢复程序执行和计时
console.log('alert()之后')
事件循环模型
- 所有代码分类
(1)初始化执行代码(同步代码):包含绑定dom事件监听,设置定时器,发送qjax请求的代码
(2)回调执行代码(异步代码):处理回调逻辑 - js引擎执行代码的基本流程:
初始化代码==>回调代码 - 模型的2个重要组成部分:
(1)事件(定时器/DOM事件/Ajax)管理模块
(2)回调队列 - 模型的运转流程
(1)执行初始化代码,将事件回调函数交给对应模块管理
(2)当事件发生时,管理模块会将回调函数及其数据添加到回调列队中
(3)只有当初始化代码执行完后(可能要一定时间),才会遍历读取回调队列中的回调函数执行
重要概念:
- 执行栈(execution stack):所有的代码都是在此空间中执行的
- 浏览器内核(browser core):js引擎模块(在主线程处理),其它模块(在主/分线程处理)
- 任务队列(task queue):与 消息队列(message queue)、 事件队列(event queueevent loop)同义。
- 事件轮询(event loop):从任务队列中循环取出回调函数放入执行栈中处理(一个接一个)
- 事件驱动模型(event-driven interaction model)
- 请求响应模型(request-response model)
![在这里插入图片描述](/upload/202105/05/202105050729055747.png)
web workers
- Web Workers 是 HTML5 提供的一个 javascript 多线程解决方案,我们可以将一些大计算量的代码交由web Worker 运行而不冻结用户界面。
- 但是子线程完全受主线程控制,且不得操作 DOM。所以,这个新标准并没有改变 JavaScript 单线程的本质。
- H5 规范提供了 js 分线程的实现,取名为:
web workers
。 - 相关API
(1)worker:构造函数,加载分线程执行的js文件。
(2)worker.prototype.onmessage:用于接收另一个线程的回调函数。
(3)worker.prototype.postMessage:向另一个线程发送消息。 - 不足
(1)worker 内代码不能操作 DOM(更新uI)。
(2)不能跨域加载 JS。
(3)不是每个浏览器都支持这个新特性。
- 使用:
(1)在分线程执行的 js 文件。
(2)在主线程中的 js 中发消息并设置回调。
这篇关于进程和线程 以及 JavaScript 执行栈的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!