[JS] promise reject catch探究

同步更新到自己的语雀，格式更容易看。可以移步:
https://www.yuque.com/diracke...

目标:
1、看try...catch... 与 .then().catch() 的catch有什么不同。
2、在promise中throw err能否被两种catch捕捉到。

先贴用到的代码

会有handle1, handle2, handle3, handle4对应四种不同的情况
运行结果和结论都写在各行代码之后了。
先写结论:
1、 .then.catch中catch的优先级高于try...catch...中的catch;
2、 在promise中throw会将promise实例变为rejected状态;
3、 异步的情况下，try...catch...中的catch无法处理rejected状态的promise.

async function axiosLike(isSuccess, info = {}) {
return new Promise((resolve, reject) => {

if (isSuccess) {
  if (info.code === "0") {
    resolve(info.data);
  } else {
    reject(info.msg);
  }
} else {
  throw "serve err";
}

});
}

const tempInfoSuccess = {
code: "0",
data: { name: "mike", age: 15 },
msg: "success",
};
const tempInfoFailed = {
code: "2",
data: { name: "mike", age: 15 },
msg: "unknow exception",
};

async function handle1(isSuccess, info = {}) {
try {

const res = await axiosLike(isSuccess, info);
console.log("res->", res);

} catch (err) {

console.log("err->", err);

}
}

// handle1(true, tempInfoSuccess); // res-> { name: "mike", age: 15 }
// handle1(true, tempInfoFailed); // err-> unknow exception
// handle1(false); // err-> serve err

// try...catch 的catch会捕获 reject()的状态,且能够拿到reject(err)中的err
// try...catch 的catch也会捕获 throw抛出的异常 并且也能拿到 throw err 的 err

function handle2(isSuccess, info = {}) {
axiosLike(isSuccess, info)

.then((res) => {
  console.log("res->", res);
})
.catch((err) => {
  console.log("err->", err);
});

}

// handle2(true, tempInfoSuccess); // res-> { name: "mike", age: 15 }
// handle2(true, tempInfoFailed); // err-> unknow exception
// handle2(false); // err-> serve err

// Promise.then().catch() 中的catch会捕获 reject()的状态,且能够拿到reject(err)中的err
// Promise.then().catch() 中的catch也会捕获 throw抛出的异常 并且也能拿到 throw err 的 err

function handle3(isSuccess, info = {}) {
try {

axiosLike(isSuccess, info)
  .then((res) => {
    console.log("res->", res);
  })
  .catch((err) => {
    console.log("err in .then.catch ->", err);
  });

} catch (err) {

console.log("err in try...catch ->", err);

}
}

// handle3(true, tempInfoFailed); // err in .then.catch -> unknow exception
// handle3(false); // err in .then.catch -> serve err
//

function handle4(isSuccess, info = {}) {
try {

axiosLike(isSuccess, info).then((res) => {
  console.log("res->", res);
});

} catch (err) {

console.log("err in try...catch ->", err);

}
}

// handle4(true, tempInfoFailed); // 报错如下 ↓
/*
UnhandledPromiseRejectionWarning: unknow exception
UnhandledPromiseRejectionWarning: Unhandled promise rejection.
This error originated either by throwing inside of an async function without a catch block,
or by rejecting a promise which was not handled with .catch().
*/
// try...catch 的catch不能处理rejected状态的promise.

handle4(false); // 报错如下 ↓
/*
UnhandledPromiseRejectionWarning: serve err
UnhandledPromiseRejectionWarning: Unhandled promise rejection.
This error originated either by throwing inside of an async function without a catch block,
or by rejecting a promise which was not handled with .catch().
*/
// throw err 也将promise实例变为了rejected状态,而try...catch 的catch不能处理

// 观察handle4()的两条执行结果,可以发现,异步结果中的报错,try...catch中的catch是无法处理的。