初识Promise：理解基本概念和应用范例

前端

2023-09-13 03:40:46

初识Promise

在JavaScript的世界里，异步编程是一门必备的技能。它允许我们在等待异步任务完成的同时，继续执行其他操作，从而避免阻塞主线程。

传统的异步编程方法是使用回调函数。回调函数是一种在异步任务完成后被调用的函数。然而，当我们使用多个嵌套的回调函数时，代码就会变得难以阅读和维护。

Promise应运而生，它为我们提供了一种更优雅、更具可读性的方式来处理异步任务。

Promise是一个对象，它代表着一个异步操作的最终结果。它有三种状态：

待定（pending）：表示操作正在进行中。
已完成（fulfilled）：表示操作已成功完成。
已拒绝（rejected）：表示操作已失败。

then方法的链式调用

Promise的then方法允许我们为Promise添加回调函数。当Promise的状态发生改变时，这些回调函数就会被调用。

then方法的语法如下：

promise.then(onFulfilled, onRejected);

onFulfilled是当Promise状态变为已完成时被调用的函数。
onRejected是当Promise状态变为已拒绝时被调用的函数。

then方法返回一个新的Promise，这个新的Promise代表着then方法中回调函数的执行结果。

我们可以使用then方法来对Promise进行链式调用。链式调用是指将多个then方法连接起来，形成一个链条。当一个Promise的状态发生改变时，它会触发下一个Promise的回调函数。

链式调用可以让我们更轻松地处理异步任务的执行结果。

resolvePromise方法

resolvePromise方法是Promise的静态方法，它可以将一个值包装成一个已完成的Promise。

resolvePromise方法的语法如下：

Promise.resolve(value);

value是要包装的值。

resolvePromise方法返回一个已完成的Promise，这个Promise的状态是已完成，它的值是value。

应用范例

让我们来看一个使用Promise的具体示例。

function getUserInfo() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve({
        name: '张三',
        age: 20
      });
    }, 1000);
  });
}

getUserInfo().then(userInfo => {
  console.log(`欢迎，${userInfo.name}！`);
}).catch(error => {
  console.error(error);
});