promise总结

最新推荐文章于 2024-09-13 10:46:15 发布

luguanyou

最新推荐文章于 2024-09-13 10:46:15 发布

阅读量395

点赞数

分类专栏：前端 javascript 文章标签：前端 javascript

本文链接：https://blog.csdn.net/luguanyou/article/details/128639385

版权

前端同时被 2 个专栏收录

7 篇文章 0 订阅

订阅专栏

javascript

1 篇文章 0 订阅

订阅专栏

Promise是JavaScript中用于处理异步操作的工具，主要解决回调地狱问题。它有三种状态：pending、fulfilled和rejected，状态一旦改变不可逆转。then方法定义成功和失败的回调，返回新的Promise对象，catch专门处理rejected状态，finally则在无论Promise结果如何时都会执行的回调。

摘要由CSDN通过智能技术生成

1、promise是什么

Promise 是异步操作的一种解决方案，是一个构造函数。

const p = new Promise(() => {});

有两个形参

const p = new Promise((resolve, reject) => {}）

2、promise解决了什么问题

Promise 一般用来解决层层嵌套的回调函数（回调地狱 callback hell）的问题

3、promise的状态

Promise 有 3 种状态，一开始是 pending（未完成），执行 resolve，变成 fulfilled(resolved)，已成功，执行 reject，变成 rejected，已失败

Promise 的状态一旦变化，就不会再改变了

4、then 方法

then有两个回调方法，第一个是成功的回调函数，第二个是失败的回调函数

p.then(
() => {
console.log('success');
},
() => {
console.log('error');
}
);

const p2=p.then()返回的也是promise对象

p2.then(
() => {
console.log('success');
},
() => {
console.log('error');
}
);

 // then 方法执行后返回一个新的 Promise 对象
      // const p = new Promise((resolve, reject) => {
      //   resolve();
      //   // reject();
      // });
      // const p2 = p
      //   .then(
      //     () => {},
      //     () => {}
      //   )
      //   .then()
      //   .then();

      // console.log(p, p2, p === p2);

      // 3.then 方法返回的 Promise 对象的状态改变
      // const p = new Promise((resolve, reject) => {
      //   // resolve();
      //   reject();
      // });
      // p.then(
      //   () => {
      //     // console.log('success');
      //   },
      //   () => {
      //     console.log('err');

      //     // 在 then 的回调函数中，return 后面的东西，会用 Promise 包装一下
      //     // return undefined;
      //     // 等价于
      //     // return new Promise(resolve => {
      //     //   resolve(undefined);
      //     // });

      //     return 123;
      //     // return new Promise(resolve => {
      //     //   resolve(123);
      //     // });

      //     // 默认返回的永远都是成功状态的 Promise 对象
      //     // return new Promise((resolve, reject) => {
      //     //   reject('reason');
      //     // });
      //   }
      // )
      //   .then(
      //     data => {
      //       console.log('success2', data);

      //       // return undefined;
      //       return new Promise(resolve => {
      //         resolve(undefined);
      //       });
      //     },
      //     err => {
      //       console.log('err2', err);
      //     }
      //   )
      //   .then(
      //     data => {
      //       console.log('success3', data);
      //     },
      //     err => {
      //       console.log('err3', err);
      //     }
      //   );

5、catch方法

catch 本质上是 then 的特例,专门用来处理 rejected 状态

相当于then(null, err => {});

new Promise((resolve, reject) => {
        // resolve(123);
        reject('reason');
      })
        .then(data => {
          console.log(data);
        })
        // .then(null, err => {
        //   console.log(err);
        // });
        .catch(err => {
          console.log(err);

          // return undefined;
          throw new Error('reason');
        })
        .then(data => {
          console.log(data);
        })
        .catch(err => {
          console.log(err);
        });

      // catch() 可以捕获它前面的错误
      // 一般总是建议，Promise 对象后面要跟 catch 方法，这样可以处理 Promise 内部发生的错误

6、finally

当 Promise 状态发生变化时，不论如何变化都会执行，不变化不执行

finally() 本质上是 then() 的特例

 new Promise((resolve, reject) => {
        // resolve(123);
        reject('reason');
      })
        .then(
          result => {
            return result;
          },
          err => {
            return new Promise((resolve, reject) => {
              reject(err);
            });
          }
        )
        .then(data => {
          console.log(data);
        })
        .catch(err => {
          console.log(err);
        });