ES7 之 Promise 对象详解-JavaScript中文网-JavaScript教程资源分享门户

Promise 是 ES6 引入的一个新的异步编程解决方案，可以更好地解决回调地狱问题，ES7 在 Promise 基础上做了一些改进，本文将详细讲解 ES7 中 Promise 对象的用法和注意事项。

Promise 是什么

Promise 是一种能够更好处理异步编程的编程范式。在传统的异步回调函数中，我们通过嵌套函数的方式处理异步代码，这种写法存在嵌套过多、可读性差、错误处理困难等问题。而 Promise 可以帮助我们更好地组织异步代码，提高可读性和可维护性。

Promise 有三种状态：pending（进行中）、resolved（已完成，又称 resolved 或者 fulfilled）和 rejected（已失败）。当 Promise 对象的状态改变时，会触发相应的回调函数。

Promise 的用法

Promise 的基础用法

创建一个 Promise 对象：

const promise = new Promise(function(resolve, reject) {
  // 异步逻辑
  let success = true;
  if (success) {
    resolve('成功');
  } else {
    reject('失败');
  }
});

Promise 对象创建时需要传入一个函数作为参数，该函数有两个参数：resolve 和 reject。如果异步逻辑顺利执行，可以调用 resolve 函数并传入成功的值，如果出现异常则调用 reject 函数并传入错误信息。

使用 Promise 对象：

promise.then(function(successMessage) {
  console.log(successMessage);
}).catch(function(errorMessage) {
  console.error(errorMessage);
});

使用 then 方法可以注册成功回调函数，使用 catch 方法可以注册失败回调函数。当 promise 被 resolve 时，将会调用 then 中注册的回调函数；当 promise 被 reject 时，将会调用 catch 中注册的回调函数。

Promise.all

Promise.all 方法接收一个 Promise 数组作为参数，返回一个新的 Promise 对象。当所有的 Promise 对象都 fulfilled 时，返回的 Promise 对象将被 resolved，如果有一个或多个 Promise 对象 rejected，则返回的 Promise 对象将被 rejected，这时只有第一个被 rejected 的 Promise 的错误信息被传入 catch 中。

Promise.all([
  Promise.resolve(1),
  Promise.resolve(2),
  Promise.resolve(3)
]).then(function(result) {
  console.log(result);  // [1, 2, 3]
});

Promise.all([
  Promise.resolve(1),
  Promise.reject('出错了'),
  Promise.resolve(3)
]).catch(function(error) {
  console.error(error);  // 出错了
});

Promise.race

与 Promise.all 相反，Promise.race 接收一个 Promise 数组作为参数，但只要有一个 Promise 对象 fulfilled 或 rejected，将返回这个 Promise 对象的值或错误信息。

Promise.race([
  new Promise(function(resolve) {
    setTimeout(() => resolve('当前放送节目'), 1000);
  }),
  new Promise(function(_, reject) {
    setTimeout(() => reject('出现异常'), 500);
  })
]).then(function(res) {
  console.log(res);  // '出现异常'
}).catch(function(err) {
  console.error(err); // '出现异常'
});

Promise.finally

Promise.prototype.finally 方法用于给 Promise 对象添加一个回调函数，该回调函数无论 Promise 对象最终状态如何都会执行。该方法不接受任何参数，不能改变 Promise 对象的状态。

Promise.resolve('done')
  .finally(() => console.log('finally'))
  .then(result => console.log(result)); // 'done', 'finally'

Promise 的注意事项

Promise 对象状态不可逆

一旦 Promise 对象的状态改变，就不能再次改变。如果不声明 reject 回调函数，当出现错误时 Promise 对象的状态将一直停留在 pending 状态，无法执行成功回调函数。

Promise 使用场景

Promise 适用于一次异步操作，例如使用 Ajax 获取数据或者执行异步任务。Promise 不适用于多次异步操作的情景，例如循环等待多个 Promise 对象的结果。

Promise.resolve

当传递给 Promise.resolve 的参数为 Promise 对象时，Promise.resolve 的返回值与传入对象相同。

Promise.resolve(Promise.resolve('done')).then(res => console.log(res)); // 'done'

总结

本文对 ES7 中 Promise 对象进行了详细的分析，介绍了 Promise 的基础用法、Promise.all、Promise.race、Promise.finally 和 Promise 的注意事项。通过学习 Promise 对象的用法，可以更好地编写异步代码，提高代码的可读性和可维护性。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/659e37a3add4f0e0ff74230e

ES7 之 Promise 对象详解