JS中的进程、线程、任务队列、事件循环、宏任务、微任务、执行栈等概念理解

简介: JS中的进程、线程、任务队列、事件循环、宏任务、微任务、执行栈等概念理解

JS中的进程、线程、任务队列、事件循环、宏任务、微任务、执行栈等概念理解

javascript中有很多需要知道的概念,尤其是标题中列出来的这些,今天就来过一下这些概念。

一、进程和线程

浏览器的每一个tab页可以看做是浏览器内核进程,每个进程下面会有多个线程来互相配合完成任务

比如 GUI线程、JS引擎线程、网络线程、定时器线程等

二、任务队列

任务队列可以当做是一个个的对调任务,当主线程的任务完成后,就开始执行任务队列中的任务(如果当前任务队列中再添加了新的异步任务,则其回调函数会放在之后的任务队列中)

三、事件循环

异步任务执行后,其回调会放到任务队列中。当主线程任务执行结束后,就去任务队列中捞接下来要做的任务,放到主线程中执行,直到任务全部结束。如果无新的任务可做,浏览器处于等待状态,知道新的外部输入、事件触发,这样一个循环过程称为事件循环。

四、宏任务和微任务

任务队列中有两种任务,一种是宏任务一种是微任务。具体概念我也没有查到,但是可以这样去理解,微任务就是执行完当前主线程任务后就要马上执行的任务,宏任务则是要放到下一次的事件循环中的主线程中的任务。

一般的宏任务有setTimeout和setInterval

微任务则有promise、process.nextTick等

五、执行栈

执行栈是解释器追踪函数执行流的一种机制。当引擎第一次遇到js代码时,会产生一个全局执行上下文压入执行栈,每遇到一个函数调用,就往栈中压入一个新的上下文。引擎执行栈顶的函数后则弹出当前执行上下文直至函数依次执行完毕并回到全局的上下文。

测试

有兴趣的同学可以试试下面代码的输出顺序

setTimeout(function () {
   console.log('1')
  });
new Promise(function (resolve) {
  console.log('2');
   resolve();
  }).then(function () {
   console.log('3')
   setTimeout(function () {
​    console.log('5')
   });
  });
console.log('4');

遇到第一个settimeout时,先把整体代码块放到第一个宏任务中,遇到promise,先执行内部的代码,把then中的代码放到为任务中。遇到console.log(4)在主线程中直接执行。之后先从微任务中捞取任务执行 console.log(3)并把后面的setTimeout放到下一个宏任务队列(第二个)中。然后从当前宏任务队列中捞取要执行的代码,打印1。然后开始到下一个事件循环,把宏任务的代码捞出来执行。

所以顺序是24315

相关文章
|
1月前
|
设计模式 JavaScript 前端开发
在JavaScript中,继承是一个重要的概念,它允许我们基于现有的类(或构造函数)创建新的类
【6月更文挑战第15天】JavaScript继承促进代码复用与扩展,创建类层次结构,但过深的继承链导致复杂性增加,紧密耦合增加维护成本,单继承限制灵活性,方法覆盖可能隐藏父类功能,且可能影响性能。设计时需谨慎权衡并考虑使用组合等替代方案。
37 7
|
1月前
|
分布式计算 JavaScript 前端开发
多线程、多进程、协程的概念、区别与联系
多线程、多进程、协程的概念、区别与联系
42 1
|
1月前
|
存储 Linux Shell
Linux进程概念(上)
冯·诺依曼体系结构概述,包括存储程序概念,程序控制及五大组件(运算器、控制器、存储器、输入设备、输出设备)。程序和数据混合存储,通过内存执行指令。现代计算机以此为基础,但面临速度瓶颈问题,如缓存层次结构解决内存访问速度问题。操作系统作为核心管理软件,负责资源分配,包括进程、内存、文件和驱动管理。进程是程序执行实例,拥有进程控制块(PCB),如Linux中的task_struct。创建和管理进程涉及系统调用,如fork()用于创建新进程。
40 3
Linux进程概念(上)
|
1月前
|
JSON JavaScript 前端开发
【JavaScript】JavaScript中的深拷贝与浅拷贝详解:基础概念与区别
JavaScript 中,理解数据拷贝的深浅至关重要。浅拷贝(如扩展运算符`...`、`Object.assign()`)仅复制对象第一层,共享内部引用,导致修改时产生意外联动。深拷贝(如自定义递归函数、`_.cloneDeep`或`JSON.parse(JSON.stringify())`)创建独立副本,确保数据隔离。选择哪种取决于性能、数据独立性和资源需求。深拷贝虽慢,但确保安全;浅拷贝快,但需小心引用共享。在面试中,理解这些概念及其应用场景是关键。
39 4
【JavaScript】JavaScript中的深拷贝与浅拷贝详解:基础概念与区别
|
1月前
|
存储 Shell Linux
Linux进程概念(下)
本文详细的介绍了环境变量和进程空间的概念及其相关的知识。
25 0
Linux进程概念(下)
|
1月前
|
JavaScript 前端开发
JavaScript函数核心概念:用于代码复用与管理。
【6月更文挑战第25天】JavaScript函数核心概念:用于代码复用与管理。示例包括定义(无参、有参、有返回值)与调用,参数按值传递。函数内修改参数不影响外部变量。
17 1
|
15天前
|
缓存 Linux 编译器
【Linux】多线程——线程概念|进程VS线程|线程控制(下)
【Linux】多线程——线程概念|进程VS线程|线程控制(下)
30 0
|
15天前
|
存储 Linux 调度
【Linux】多线程——线程概念|进程VS线程|线程控制(上)
【Linux】多线程——线程概念|进程VS线程|线程控制(上)
34 0
|
1月前
|
存储 前端开发 JavaScript
JavaScript 事件循环的详细描述
【6月更文挑战第15天】JavaScript事件循环是单线程非阻塞I/O的关键,通过调用栈跟踪同步函数,任务队列存储异步任务,事件循环在调用栈空时从队列取任务执行。当遇到异步操作,回调函数进入队列,同步代码执行完后开始事件循环,检查并执行任务。微任务如Promise回调在每个宏任务结束时执行,确保不阻塞主线程,优化用户体验。
30 6
|
21天前
|
JavaScript
js【详解】event loop(事件循环/事件轮询)
js【详解】event loop(事件循环/事件轮询)
20 0