异步编程语法必知必会的知识点：Promise、Generator、Async和Await

2024-01-26 11:10:39

异步编程的概念和原理

在传统的编程语言中，程序的执行是按照顺序进行的，即一条语句执行完后，再执行下一条语句。而在异步编程中，程序的执行可以并发进行，即多条语句可以同时执行。这使得异步编程可以大大提高程序的执行效率，尤其是在处理大量数据或需要频繁与外部设备交互的情况下。

异步编程的实现方式有很多种，其中最常见的就是使用回调函数。回调函数是指在某个事件发生后执行的函数。例如，在JavaScript中，我们可以使用addEventListener()方法为元素添加事件监听器，当元素触发该事件时，就会执行指定的回调函数。

Promise

Promise是一种异步编程技术，它可以使我们更轻松地编写异步代码。Promise对象表示一个异步操作的最终结果，它有三种状态：pending、fulfilled和rejected。

pending：表示异步操作正在进行中。
fulfilled：表示异步操作已成功完成。
rejected：表示异步操作已失败。

我们可以使用then()方法来监听Promise对象的state变化，并指定在不同state下要执行的代码。例如，我们可以这样使用Promise对象：

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Hello, world!');
  }, 1000);
});

promise.then((result) => {
  console.log(result); // 输出: Hello, world!
});

Generator

Generator是一种异步编程技术，它可以使我们更方便地编写异步代码。Generator函数是一种特殊的函数，它可以暂停自己的执行，并在稍后继续执行。这使得我们可以将异步代码写成同步代码的形式，从而使代码更易于阅读和维护。

我们可以使用yield来暂停Generator函数的执行。当Generator函数遇到yield关键字时，它会返回当前的值，并暂停自己的执行。当我们再次调用Generator函数时，它会从上次暂停的位置继续执行。

例如，我们可以这样使用Generator函数：

function* helloWorld() {
  yield 'Hello, ';
  yield 'world!';
}

const generator = helloWorld();

console.log(generator.next().value); // 输出: Hello,
console.log(generator.next().value); // 输出: world!

Async和Await

Async和Await是ES8中引入的异步编程技术。Async函数是一种特殊的函数，它可以使我们更轻松地编写异步代码。Await关键字可以使我们暂停Async函数的执行，直到异步操作完成。这使得我们可以将异步代码写成同步代码的形式，从而使代码更易于阅读和维护。

我们可以这样使用Async和Await：

async function helloWorld() {
  const result = await new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('Hello, world!');
    }, 1000);
  });

  console.log(result); // 输出: Hello, world!
}

helloWorld();