你在 JavaScript 代码是如何执行之前有想过这个问题吗？

我们都知道 JavaScript 是一种单线程和非阻塞的脚本语言，那是什么意思呢？

单线程：这意味着一次只能发生一件事
非阻塞：假设您正在运行一个函数，该函数在该任务期间需要 30 秒，我们正在等待 30 秒，然后才能发生其他任何事情！当然，这不会发生

这意味着它不等待异步代码的响应

为了更好地理解异步 JavaScript，让我们看一下下面的代码：

console.log("Hello 1"); setTimeout(function() {
  console.log("Goodbye!");    }, 3000);console.log("Hello 2 ");

跟我一起想想最后的结果是什么..

上面的代码发生了什么？

JavaScript 逐行运行，但它是非阻塞语言，因此它会运行准备好的函数，并且函数需要稍后执行
所以对于异步 JavaScript，JavaScript 在执行函数时不会等待响应，因此它首先执行“Hello 1”然后是“Hello 2”并在 3 秒后执行“再见！”

实际的 JavaScript 执行非常简单，但它与您首先需要了解的四个概念相关联。

调用栈：
JavaScript 只有一个调用栈，调用栈是
JS 引擎的一部分，当我们运行代码时调用一个函数，它会被
添加到调用栈中。如果这个函数是异步的，比如
(timeout(setTimeOut),Ajax request, ..) 它会移动到 web APIs 。
这意味着一次只能执行一件事

Web APIs ：
这是一个异步函数存在的地方，直到它
完成执行，完成后它简单地被添加
到回调队列中

回调队列：
当浏览器完成时间（或
它为 JS 提供的任何其他 API）时，它不会
立即将要执行的代码传输回 JavaScript。浏览器
完成后，会将代码存储在回调队列中。它是一个
包含一些函数或代码的队列，这些函数或代码将
在以后被回调。

事件循环：
有一个简单的工作，它检查主堆栈是否为空，
当它为空时，它检查回调队列。如果
队列中有待执行的代码，则将它们
一一转移到调用堆栈中。代码执行完后离开
栈，队列中的下一个上来，直到
队列为空

我们可以看到第一个函数被推送到调用堆栈
并立即在控制台中执行 Hi，然后异步
函数 (setTimeOut) 从调用堆栈转移到 web apis 直到
它完成执行然后移动到回调队列，当调用堆栈
为空时，事件循环将异步函数转移到堆栈
执行。

结论

我们了解了谁在后台执行同步和异步代码
，我们知道调用
堆栈、Web api、回调队列和事件循环的含义是什么。

ITPub博客