快速避坑 聊聊关于5个用promise的常见错误

前言

在 JavaScript 开发中，Promise 是一种用于处理异步操作的语法糖。它提供了一种更加优雅和可读性强的方式来处理异步代码。然而，由于 Promise 的复杂性和一些常见的误用，有时候我们可能会遇到一些问题。在本文中，我们将讨论五个使用 Promise 时常见的错误，并提供相应的解决方案。

错误一：忽略错误处理

在编写 Promise 时，一个常见的错误是忽略错误处理。具体来说，当 Promise 被拒绝时，我们应该使用 catch 方法或在 Promise 链的末尾添加错误处理的回调函数。如果忽略错误处理，可能会导致未捕获的异常并且代码无法正确处理错误。

// 错误示例
asyncFunction().then(result => {
  // 执行成功的操作
});

// 正确示例
asyncFunction().then(result => {
  // 执行成功的操作
}).catch(error => {
  // 错误处理
});

错误二：错误地使用resolve和reject

Promise 构造函数接受一个执行器函数，该函数具有两个参数，即 resolve 和 reject。在执行器函数内部，我们应该调用这两个函数来处理 Promise 的状态。然而，有时候我们可能会错误地使用 resolve 和 reject，导致 Promise 的状态无法正确地被设置。

// 错误示例
new Promise((resolve, reject) => {
  if (someCondition) {
    resolve('Success');
  } else {
    resolve('Failure');
  }
});

// 正确示例
new Promise((resolve, reject) => {
  if (someCondition) {
    resolve('Success');
  } else {
    reject('Failure');
  }
});

错误三：忘记返回 Promise

在使用 Promise 的过程中，我们需要确保每个 then 方法都返回一个新的 Promise。如果忘记返回 Promise，可能会导致链式调用的结果不符合预期。

// 错误示例
asyncFunction().then(result => {
  console.log(result);
}).catch(error => {
  console.error(error);
});

// 正确示例
asyncFunction().then(result => {
  console.log(result);
  return result;
}).catch(error => {
  console.error(error);
});

错误四：串行调用时不正确地使用 async/await

使用 async/await 可以使 Promise 的写法更加直观和易读。然而，在串行调用多个 Promise 时，有时候我们会错误地使用 async/await，导致代码执行出错或无法按预期顺序执行。

// 错误示例
async function foo() {
  const result1 = await promise1();
  const result2 = await promise2();
  return result2;
}

// 正确示例
async function foo() {
  const result1 = await promise1();
  const result2 = await promise2();
  return result2;
}

// 或者使用 Promise.all
async function foo() {
  const [result1, result2] = await Promise.all([promise1(), promise2()]);
  return result2;
}

错误五：忘记处理未捕获的 Promise 拒绝

当一个 Promise 被拒绝时，如果没有适当地捕获该拒绝，可能会导致未捕获的 Promise 拒绝警告或导致程序崩溃。因此，我们应该始终在 Promise 链的末尾添加错误处理，以确保任何拒绝的 Promise 都能被正确处理。

asyncFunction().then(result => {
  // 执行成功的操作
}).catch(error => {
  // 错误处理
});

综上所述，了解这些常见的 Promise 错误并避免它们，将能够更加有效地使用 Promise 来处理异步操作，并提升代码的可靠性和可维护性。