从Callback到 Promise：异步 JavaScript 演进史

2023-09-28 10:56:15

1. Callback：异步编程的开端

在 JavaScript 中，最基础的异步调用方式是 Callback，它将回调函数 Callback 传给异步 API，由浏览器或 Node 在异步完成后，通知 JS 引擎调用 Callback。对于简单的异步操作，用 Callback 实现，是够用的。但随着复杂交互页面和 Node 的出现，Callback 方案逐渐暴露出了它的弊端：

代码难以阅读和维护： Callback 的嵌套会使代码变得难以阅读和维护，尤其是当需要处理多个异步操作时。
难以控制错误处理： Callback 的错误处理机制不够完善，当异步操作发生错误时，很难追踪和定位错误。
难以测试： Callback 的测试也比较困难，因为你需要模拟异步操作的完成，这可能会导致测试代码变得复杂和脆弱。

2. Promise：异步编程的救星

Promise 的出现，正是为了解决 Callback 方案的这些弊端。Promise 是一个对象，它表示一个异步操作的最终完成或失败。它提供了 then() 方法，可以让你在异步操作完成后执行指定的回调函数。Promise 有以下优点：

代码更易读和维护： Promise 使得异步代码更易读和维护，因为你可以使用 then() 方法来链式调用多个异步操作，而不用再使用嵌套的 Callback。
更好的错误处理： Promise 提供了 catch() 方法，可以让你在异步操作发生错误时执行指定的回调函数。这使得错误处理变得更加简单和方便。
更易于测试： Promise 可以很容易地进行测试，因为你可以使用模拟来模拟异步操作的完成，而不用再担心测试代码的复杂性和脆弱性。

3. Generator 和 Async/Await：异步编程的未来

Generator 和 Async/Await 是 JavaScript 中的两个新的异步编程特性。它们允许你编写异步代码，就像编写同步代码一样。Generator 是一个函数，它可以暂停自己的执行，并在以后继续执行。Async/Await 是一个语法糖，它允许你使用 await 来暂停 Generator 函数的执行，直到异步操作完成。Generator 和 Async/Await 有以下优点：

代码更具同步性： Generator 和 Async/Await 使得异步代码更具同步性，因为你可以使用 await 关键字来暂停 Generator 函数的执行，直到异步操作完成。这使得异步代码更容易阅读和理解。
更易于调试： Generator 和 Async/Await 使得异步代码更易于调试，因为你可以使用断点来暂停 Generator 函数的执行，并检查变量的值。这使得调试异步代码变得更加简单和方便。

4. 异步编程技术的选用

在实际开发中，你可以根据不同的情况选择合适的异步编程技术。一般来说，对于简单的异步操作，可以使用 Callback 方案。对于复杂的异步操作，可以使用 Promise 或 Generator 和 Async/Await。