then
then 函数的会接收两个回调函数,一个是 onFulfilled 函数,一个是 onRejected 函数
如果这两个回调函数没有写返回值,默认会 return undefined;
进入下一个函数的 onFulfilled 函数中
const p = new Promise((resolve, reject) => {resolve(22);
});
p.then((success1) => {console.log("success1", success1); // "success2" 22// 没写 return 默认返回 return undefined},(err1) => {console.log("err1", err1);}
).then((success2) => {console.log("success2", success2); // "success2" undefined},(err2) => {console.log("err2", err2);}
);
在这两个回调中 return xxx ,相当于调用 return new Promise((resolve) => resolve(xxx));
const p = new Promise((resolve, reject) => {resolve(22);
});
p.then((success1) => {return new Promise((resolve, reject) => resolve("success"));// 等价于return "success";},(err1) => {console.log("err1", err1);}
).then((success2) => {console.log("success2", success2); // "success2" "success"},(err2) => {console.log("err2", err2);}
);
在 onFulfilled 函数和 onRejected 函数中默认返回的都是成功,如果需要返回失败需要显示调用 reject 或者用 throw 抛出错误可以
const p = new Promise((resolve, reject) => {resolve(22);
});
p.then((success1) => {return new Promise((resolve, reject) => reject("error"));// 等价于// throw "error";},(err1) => {console.log("err1", err1);}
).then((success2) => {console.log("success2", success2);},(err2) => {console.log("err2", err2); // "err2" error}
);
总结:在 then 回调中 return xxx 会被自动包装成 return new Promise((resolve) => resolve(xxx));,
catch
catch 是用来处理 rejected 状态,是 then 函数的一种特例,相当于 then(null, (err) => {});
catch 为什么能捕获前面的错误?
在 onRejected 函数中,如果没有显示抛出错误,默认会 return undefined; 进入一下个 onFulfilled 函数
finally
finally 不管当前 promise 是什么状态都会执行,也是 then 函数的一种特例,相当于 then(result => result, err => new Promsie((\_, reject) => reject(err)));
Promise.resolve
Promise.resolve 是 Promise 在 fulfilled 状态时的简写,相当于 new Promise(resolve => resolve(xxx))
onFulfilled 函数接收参数
- 当参数是普通参数时,会直接传递给后面
then函数new Promise((resolve) => resolve({ name: "uccs" })).then((data) => {console.log(data);});* 当参数是Promise对象时,后面的then会根据传递的Promise对象的状态变化执行哪一个回调const p = new Promise((resolve, reject) => {setTimeout(resolve, 1000, "我执行了");});new Promise((resolve) => resolve(p)).then((data) => {console.log(data);});* 具有then方法的对象* 用这种这种方式,如果需要改变Promise状态是,不能使用return形式,这个then方法也是有两个回调函数的:onFulfilled和 `onRejected````const thenable = {then(resolve, reject) {console.log(“thenable”);},};new Promise((resolve) => resolve(thenable)).then((data) => {console.log(data);}); ```Promise.reject
Promise.reject 是 Promise 在 rejected 状态是的简写,相当于 new Promise((_, reject) => reject(xxx))
onRejected 函数不管接收什么参数,都会原封不动的向后传递,作为后续方法的参数
最后
整理了一套《前端大厂面试宝典》,包含了HTML、CSS、JavaScript、HTTP、TCP协议、浏览器、VUE、React、数据结构和算法,一共201道面试题,并对每个问题作出了回答和解析。

有需要的小伙伴,可以点击文末卡片领取这份文档,无偿分享
部分文档展示:




文章篇幅有限,后面的内容就不一一展示了
有需要的小伙伴,可以点下方卡片免费领取
本文介绍了Promise的基础,包括then、catch、finally方法的使用。重点讲解了如何处理错误,catch用于捕获then中未显式抛出的错误,finally则在无论Promise状态如何都会执行。还提到了Promise.resolve和Promise.reject的用法,以及如何处理具有then方法的对象。最后,作者分享了一套前端大厂面试宝典,包含多方面的面试题解析。
2284

被折叠的 条评论
为什么被折叠?



