javascript - 提前解决/拒绝后我需要返回吗？

Question

假设我有以下代码。

function divide(numerator, denominator) {
 return new Promise((resolve, reject) => {

  if(denominator === 0){
   reject("Cannot divide by 0");
   return; //superfluous?
  }

  resolve(numerator / denominator);

 });
}

如果我的目标是使用 reject 提前退出，我是否也应该养成 return 之后立即退出的习惯？

Answer 1

return的目的是在reject之后终止函数的执行，并阻止后面的代码执行。

function divide(numerator, denominator) {
  return new Promise((resolve, reject) => {

    if (denominator === 0) {
      reject("Cannot divide by 0");
      return; // The function execution ends here 
    }

    resolve(numerator / denominator);
  });
}

在这种情况下，它会阻止 resolve(numerator/denominator); 执行，这不是严格需要的。但是，最好还是终止执行以防止将来出现可能的陷阱。此外，防止不必要地运行代码是一种很好的做法。

背景

promise 可以处于 3 种状态之一:

1. 待定 - 初始状态。我们可以从待定状态转移到其他状态之一
2. 已完成 - 操作成功
3. 拒绝 - 操作失败

当一个 promise 被履行或被拒绝时，它将无限期地保持在这个状态(已解决)。因此，拒绝履行的 promise 或履行被拒绝的 promise 都不会产生影响。

这个示例片段显示，虽然 promise 在被拒绝后实现了，但它仍然被拒绝。

function divide(numerator, denominator) {
  return new Promise((resolve, reject) => {
    if (denominator === 0) {
      reject("Cannot divide by 0");
    }

    resolve(numerator / denominator);
  });
}

divide(5,0)
  .then((result) => console.log('result: ', result))
  .catch((error) => console.log('error: ', error));

那么我们为什么需要返回呢？

虽然我们无法更改已解决的 promise 状态，但拒绝或解决不会停止函数其余部分的执行。该函数可能包含会产生令人困惑的结果的代码。例如:

function divide(numerator, denominator) {
  return new Promise((resolve, reject) => {
    if (denominator === 0) {
      reject("Cannot divide by 0");
    }
    
    console.log('operation succeeded');

    resolve(numerator / denominator);
  });
}

divide(5, 0)
  .then((result) => console.log('result: ', result))
  .catch((error) => console.log('error: ', error));

即使函数现在不包含这样的代码，这也可能会造成 future 的陷阱。 future 的重构可能会忽略这个事实，即在 promise 被拒绝后代码仍在执行，并且很难调试。

解决/拒绝后停止执行:

这是标准的 JS 控制流。

• resolve/reject后返回:

function divide(numerator, denominator) {
  return new Promise((resolve, reject) => {
    if (denominator === 0) {
      reject("Cannot divide by 0");
      return;
    }

    console.log('operation succeeded');

    resolve(numerator / denominator);
  });
}

divide(5, 0)
  .then((result) => console.log('result: ', result))
  .catch((error) => console.log('error: ', error));

• 用resolve/reject返回——由于回调的返回值被忽略，我们可以通过返回reject/resolve语句来节省一行:

function divide(numerator, denominator) {
  return new Promise((resolve, reject) => {
    if (denominator === 0) {
      return reject("Cannot divide by 0");
    }

    console.log('operation succeeded');

    resolve(numerator / denominator);
  });
}

divide(5, 0)
  .then((result) => console.log('result: ', result))
  .catch((error) => console.log('error: ', error));

• 使用 if/else block :

function divide(numerator, denominator) {
  return new Promise((resolve, reject) => {
    if (denominator === 0) {
      reject("Cannot divide by 0");
    } else {
      console.log('operation succeeded');
      resolve(numerator / denominator);
    }
  });
}

divide(5, 0)
  .then((result) => console.log('result: ', result))
  .catch((error) => console.log('error: ', error));

我更喜欢使用 return 选项之一，因为代码更扁平。