数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装学
法学异步 JavaScript 中微任务队列和回调队列的区别是什么？
在异步 JavaScript 中，有两种调度任务的方式——**微任务队列**和**回调队列**。JavaScript 引擎对这两个队列的处理方式不同。
微任务队列
**微任务队列**是一个任务队列，其中的任务在当前任务之后执行。JavaScript 引擎在转到回调队列中的下一个任务之前，会先处理微任务队列。
示例
这是一个微任务队列如何工作的示例：
<!doctype html>
<html>
<head>
<title>Examples</title>
</head>
<body>
<div id="result"></div>
<script>
console.log('start');
setTimeout(function() {
console.log('setTimeout');
}, 0);
Promise.resolve().then(function() {
console.log('promise resolve');
});
console.log('end');
</script>
</body>
</html>在上面的示例中，“`setTimeout`”回调被添加到回调队列。“`Promise.resolve`”被添加到微任务队列。JavaScript 引擎会先执行微任务队列中的所有任务，然后再转到回调队列。
因此，上述代码的输出（**在控制台**）将是：
start end promise resolve setTimeout
回调队列
**回调队列**是一个任务队列，其中的任务在当前任务之后执行。**回调队列**由 JavaScript 引擎在执行完微任务队列中的所有任务之后处理。
示例
这是一个回调队列如何工作的示例：
<!doctype html>
<html>
<head>
<title>Examples</title>
</head>
<body>
<div id="result"></div>
<script>
console.log('start');
setTimeout(function() {
console.log('setTimeout');
}, 0);
console.log('end');
</script>
</body>
</html>在上面的示例中，“`setTimeout`”回调被添加到回调队列。JavaScript 引擎会在完成当前任务中所有代码的执行后执行“`setTimeout`”回调。
因此，上述代码的输出（**在控制台**）将是：
start end setTimeout
微任务队列和回调队列的区别
微任务队列和回调队列之间的一些区别是：
**微任务**队列由 JavaScript 引擎在转到回调队列中的下一个任务之前处理。**回调**队列由 JavaScript 引擎在执行完微任务队列中的所有任务之后处理。
**微任务**队列在当前任务完成后处理。**回调**队列在微任务队列为空后处理。
**微任务**队列在单独的事件循环中处理。**回调**队列在相同的事件循环中处理。
微任务队列的优点
微任务队列相对于回调队列的一些优点是：
微任务队列在单独的事件循环中处理，这意味着如果主线程被阻塞，微任务队列仍然会被处理。
微任务队列在当前任务完成后处理，这意味着任何依赖于当前任务的代码都可以添加到微任务队列中，并且会在当前任务完成后立即执行。
微任务队列的优先级高于回调队列，这意味着如果两个队列都计划同时执行，则微任务队列将首先执行。
回调队列的优点
回调队列相对于微任务队列的一个优点是，回调队列在与主线程相同的事件循环中处理。这意味着如果主线程被阻塞，回调队列将不会被处理。
结论
在本教程中，我们了解了异步 JavaScript 中微任务队列和回调队列的区别。我们还了解了每个队列的优点。
3K+ 浏览量
