Better

Ethan的博客,欢迎访问交流

then vs catch vs finally

常识呀,基础呀

onrejected 会在 Promise 异常或者 reject 的时候被调用,在提供了 onrejected 函数的前提下,后续的 catch 不会被调用,可以理解成错误已经被处理

new Promise((resolve, reject) => {
  throw new Error("123");
})
  .then(
    (res) => {
      console.log("resolve", res);
      return 1;
    },
    (res) => {
      console.log("reject", res);
      return 2;
    }
  )
  .catch((res) => {
    console.log("catch", res);
    return 3;
  })

// reject Error: 123

Promise 的抛错具有冒泡性,如果没有被处理,则能够不断传递,这样就能在下一个 catch 中统一处理

new Promise((resolve, reject) => {
  throw new Error("123");
})
  .then(
    (res) => {
      console.log("resolve", res);
      return 1;
    }
  )
  .catch((res) => {
    console.log("catch", res);
    return 3;
  })

// catch Error: 123

事实上 catch(onRejected) 从内部调用了 then(undefined, onRejected)

new Promise((resolve, reject) => {
  throw new Error("123");
})
  .then(
    (res) => {
      console.log("resolve", res);
      return 1;
    }
  )
  .then(undefined, (res) => {
    console.log("undefined", res);
    return 3;
  })

// undefined Error: 123

如果 Promise 被 reject 掉,则 onrejected 和 catch 的参数为 reject 的值。如果是因为异常,则会是异常对象

new Promise((resolve, reject) => {
  // throw new Error("123");
  reject(1)
})
  .then(
    (res) => {
      console.log("resolve", res);
      return 1;
    }
  )
  .catch(e => {
    console.log(e)
  })

// Error 123
// 1

then 和 catch 都可以返回一个新的 Promise 对象,可以链式调用

new Promise((resolve, reject) => {
  throw new Error("123");
})
  .then(
    (res) => {
      console.log("resolve", res);
      return 1;
    }
  )
  .catch((res) => {
    console.log("catch", res);
    return 3;
  })
  .then(res => {
    console.log(res);
  })

finally 本身无异常抛出的情况下,总是会返回原来的 Promise 对象值,

new Promise((resolve, reject) => {
  throw new Error("123");
})
  .then(
    (res) => {
      console.log("resolve", res);
      return 1;
    }
  )
  .catch((res) => {
    console.log("catch", res);
    return 3;
  })
  .finally((res) => {
    console.log("finally", res);
  })
  .then((res) => {
    console.log("then", res);
  });

// catch Error 123
// finally undefined
// then 3

finally 若抛出异常,则返回异常的 Promise 对象

new Promise((resolve, reject) => {
  throw new Error("123");
})
  .then(
    (res) => {
      console.log("resolve", res);
      return 1;
    }
  )
  .finally((res) => {
    console.log("finally", res);
    throw new Error(456);
  })
  .catch((val) => {
    console.log(val);
  })

// finally undefined
// Error: 456


留言