此前封装了基础版myAjax,今天就需要利用promise的知识改进成myAjaxPro
原理就是取代之前的success回调函数,利用promise的resolve和reject来传递我们的正确返回和错误返回。
封装完成如下:
后续如果需要使用的话,将网址和参数传递进去,然后可以得到一个promise的实例,然后再用实例方法then()打印或者做其他操作即可。
回调地狱
谈及promise,必须要提到回调地狱。
回调地狱是一种编程中的问题,指的是当你使用回调函数嵌套多层时,代码变得非常复杂和难以理解的情况。这种情况通常出现在异步编程中,当一个函数依赖另一个函数的结果时,它会通过回调函数的方式来获取结果,如果这种依赖层层嵌套,就会出现回调函数嵌套多层的情况,代码难以维护和理解。为了避免回调地狱,我们可以使用Promise、async/await等解决方案来简化异步编程的复杂度。
我的理解是,如果按照原始的写法,我们的代码会越来越“胖”,如图
而如果采用了promise的写法,多次嵌套均会写在then里面,这样函数就会越来越长,而不是越来越胖,也更容易看懂的吧。
当我们创建一个 Promise 实例时,它有三种状态:
- Pending(进行中):最初的状态,promise 对象被创建,但是还没有被解决(fulfilled)或被拒绝(rejected)。
2. Fulfilled(已完成):意味着承诺被解决,并返回预期的结果。
const myPromise = new Promise((resolve, reject) => {
resolve('promise resolved');
});
myPromise.then((result) => {
// promise 处于 fulfilled 状态
console.log(result); // 输出 "promise resolved"
});
- Rejected(已拒绝):意味着承诺被拒绝,并返回一个拒绝理由(通常是一个错误对象)。
const myPromise = new Promise((resolve, reject) => {
reject(new Error('promise rejected'));
});
myPromise.catch((error) => {
// promise 处于 rejected 状态
console.log(error.message); // 输出 "promise rejected"
});
promise实例方法
1. then
一般用then来接收成功返回的信息,也就是resolve传递的信息
2. catch
而catch则是用来接受失败情况的消息,换句话说,就是reject传递的消息,当然也可以是throw的消息,这些例子下面都有
3. finally
这个finally则是不管成功还是失败,只要你写了就一定会执行的