promise中reject和throw的使用

javascript 复制代码
async function promiseThrow() {
  return new Promise((resolve, reject) => {
    throw new Error("promise error"); 
  });
}
//这样会正常处理
async function promiseThrow() {
  return new Promise(async (resolve, reject) => {
    throw new Error("promise error"); 
  });
}
//这样会出错,外部无法捕获

1. 不使用 async 关键字的 Promise 构造函数回调函数

ts 复制代码
async function promiseThrow() {
 return new Promise((resolve, reject) => { throw new Error("promise error"); }); 
}
promiseThrow().catch((error) => { console.error("Caught error:", error.message); });

在这个例子中,Promise 构造函数的回调函数内部直接 throw new Error("promise error")。虽然这是一个同步错误,但由于它发生在 Promise 构造函数的执行环境中,JavaScript 引擎会将这个错误封装成一个 rejected Promise,并将其关联到返回的 Promise 实例上。因此,外部通过 .catch 方法可以正常捕获这个错误。 2. 使用 async 关键字的 Promise 构造函数回调函数

ts 复制代码
async function promiseThrow() {
 return new Promise(async (resolve, reject) => { throw new Error("promise error"); }); 
} 
promiseThrow().catch((error) => { console.error("Caught error:", error.message); });

在这个例子中,Promise 构造函数的回调函数是一个 async 函数。当 throw new Error("promise error") 执行时,它会生成一个 rejected Promise,但这个 rejected Promise 并未被 Promise 构造函数捕获和处理。由于 async 函数内部的错误被转换为 rejected Promise,这个 rejected Promise 只会在 async 函数返回的 Promise 中体现出来,而 Promise 构造函数本身并未等待这个内部 async 函数的结果。因此,外部的 .catch 无法捕获到这个错误,导致程序意外终止。

结论:

  • 当在不使用 async 关键字的 Promise 构造函数回调函数中 throw 错误时,错误会被 Promise 机制捕获并转换为 rejected Promise,外部的 .catch 可以正常捕获这个错误。
  • 当在使用 async 关键字的 Promise 构造函数回调函数中 throw 错误时,由于 async 函数返回的 Promise 被忽略了,错误实际上未被 Promise 构造函数捕获,导致外部的 .catch 无法捕获,程序意外终止。

对于这种情况,正确的做法是避免在 Promise 构造函数回调函数中使用 async 关键字,或者在 async 回调函数内部使用 reject 来传递错误,如下所示:

ts 复制代码
async function promiseThrow() {
 return new Promise((resolve, reject) => { reject(new Error("promise error")); }); 
} 
// 或者 
async function promiseThrow() {
 return new Promise((resolve, reject) => { const innerPromise = async () => { throw new Error("promise error"); 
};
innerPromise().then(resolve, reject); }); } 
// 外部捕获错误 
promiseThrow().catch((error) => { console.error("Caught error:", error.message); });
相关推荐
滚雪球~25 分钟前
npm error code ETIMEDOUT
前端·npm·node.js
沙漏无语27 分钟前
npm : 无法加载文件 D:\Nodejs\node_global\npm.ps1,因为在此系统上禁止运行脚本
前端·npm·node.js
supermapsupport28 分钟前
iClient3D for Cesium在Vue中快速实现场景卷帘
前端·vue.js·3d·cesium·supermap
brrdg_sefg30 分钟前
WEB 漏洞 - 文件包含漏洞深度解析
前端·网络·安全
胡西风_foxww36 分钟前
【es6复习笔记】rest参数(7)
前端·笔记·es6·参数·rest
m0_7482548838 分钟前
vue+elementui实现下拉表格多选+搜索+分页+回显+全选2.0
前端·vue.js·elementui
星就前端叭1 小时前
【开源】一款基于Vue3 + WebRTC + Node + SRS + FFmpeg搭建的直播间项目
前端·后端·开源·webrtc
m0_748234521 小时前
前端Vue3字体优化三部曲(webFont、font-spider、spa-font-spider-webpack-plugin)
前端·webpack·node.js
Web阿成1 小时前
3.学习webpack配置 尝试打包ts文件
前端·学习·webpack·typescript
jwensh2 小时前
【Jenkins】Declarative和Scripted两种脚本模式有什么具体的区别
运维·前端·jenkins