前端提高(二)-Promise

Promise 是JavaScript中的一种异步编程解决方案，它用于处理异步操作。

Promise 对象代表了一个尚未完成、但预期将来会完成的异步操作，并可以获取该操作的结果或失败原因。 Promise 对象有以下三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。

在创建 Promise 实例时，需要传入一个函数，这个函数被称为执行器函数 executor，并且其接收两个参数：resolve 和 reject。其中，resolve 函数表示成功的回调，reject 函数表示失败的回调。当异步操作顺利完成时，通过 resolve 将返回值传递给下一个 then 方法；如果操作是异常情况，那么则会执行传递给 reject 的回调。

const promise = new Promise((resolve, reject) => {
  // 异步操作
  if (/* 操作成功 */) {
    resolve("成功的结果")
  } else {
    reject("失败的原因")
  }
})

接着我们可以通过使用 .then() 方法对 promise 实例添加成功、失败回调函数来处理操作结果：

promise.then((result) => {
  console.log(result)
}, (error) => {
  console.error(error)
})

在.then()方法中，在第一个函数内传递 resolve 数据，在第二个函数中捕获 reject 错误信息。同时，我们可以通过在 .then() 方法中多次调用实现连续地进行异步操作，而无需层层嵌套回调函数（即所谓的"回调地狱")：

promise.then((result) => {
  console.log(result)
  return new Promise((resolve, reject) => {
    // 另一个异步操作
    if (/* 操作成功 */) {
      resolve("第二次操作成功结果")
    } else {
      reject("第二次操作失败原因")
    }
  })
}).then((result) => {
  console.log(result)
}).catch((error) => {
  console.error(error)
})

在上面的代码中，我们通过 .catch() 方法捕获了 promise 实例中的错误信息。

Promise.all 和 Promise.race 是 Promise 的两种扩展应用。当需要同时执行多个异步操作时，可以使用 Promise.all 将它们捆绑为一个数组，并在所有操作都完成时访问它们的结果。与其不同的是，Promise.race 则在任何一个异步操作完成后就停止运行，返回该异步操作的结果。

// Promise.all
const promises = [
  Promise.resolve(1),
  Promise.resolve(2),
  Promise.resolve(3)
]
Promise.all(promises).then(results => {
  console.log(results) // [1, 2, 3]
})

// Promise.race
const promises = [
  Promise.resolve(1),
  new Promise(resolve => setTimeout(() => resolve(2), 1000)),
  Promise.resolve(3)
]
Promise.all(promises).then(result => {
  console.log(result) // 1
})

总之，Promise 能够用于优雅地处理异步操作和减少回调地狱嵌套问题，同时可以通过 Promise.all 和 Promise.race 扩展 Promise 的应用场景，使 Promise 变得更加灵活和强大。