《Promise学习笔记》- 2Promise相关常用方法总结

2021-06-02 19:04:58 阅读：209 来源： 互联网

标签：resolve const 笔记 res value Promise 2Promise reject

首先介绍两个属于Promise函数对象的两个方法，在函数内部使用。

Promise.resolve()

语法：Promise.resolve(value)；

注意，这里的参数value可以是一个Promise类型的对象，也可以是一个非Promise类型的对象；并且能够返回一个成功或失败的Promise对象。

第一种情况，value是Promise类型的对象。此时所返回的Promise对象的状态由所接受参数value的状态所决定，也就是在下面代码中，如果value的状态为失败则p也是失败的，反之如果value成功则p也成功；p成功或失败的状态值就是value成功或失败的值！

const value = new Promise((resolve,reject)=>{
    resolve(11);
})
const p = Promise.resolve(value);        // 状态为resolved

const value = new Promise((resolve,reject)=>{
    reject(22);
})
const p = Promise.resolve(value);        // 状态为rejected

其次如果是非Promise类型的对象，这里可以是数字、字符串或者undefined等等类型，甚至可以为空。那么此时所返回的Promise对象一定为成功的状态，并且传入的value值就是成功的状态值。

const p = Promise.resolve(undefined);   // 状态为fulfilled，并且成功状态值为undefined

Promise.reject()

语法：Promise.reject(value)；

注意，这里的参数value可以是一个Promise类型的对象，也可以是一个非Promise类型的对象；需要强调的是所返回的Promise对象的状态始终是失败的，传入的value值就是失败的状态值！

const value = new Promise((resolve,reject)=>{
    resolve(11);
})
const p = Promise.resolve(value);        // 状态为rejected

const value = new Promise((resolve,reject)=>{
    reject(22);
})
const p = Promise.resolve(value);        // 状态为rejected
const p = Promise.reject(undefined);     // 状态为rejected，并且失败状态值为undefined

其次是两个属于Promise实例对象的方法，可以供实例对象p使用。

Promise.prototype.then()

语法：p.then(value => {...},reason => {...})

其最多接收两个参数，分别是成功或失败状态的回调函数。当p的状态变为成功或失败时，则调用相应的回调函数。

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

假设实例对象p的状态为成功（失败的情况大家可以自己测试一下），并且成功的值为111，那么一定会执行第一个参数指定的回调函数（这里为了代码简介没有指定失败状态的回调函数）。

具体的返回值返回规则如下：

没有返回值。那么then返回成功状态的Promise ，并且成功的状态值是undefined。
```
const res = p.then(value => {
    console.log(value);
})
console.log(res);
```
有返回值。那么then返回成功状态的Promise，并且成功的状态值就是该返回值。
```
const res = p.then(value => {
    return 222;
})
console.log(res);
```
抛出异常。那么then返回失败状态的Promise，并且失败的状态值是抛出的异常值。
```
const res = p.then(value => {
    throw '333';
})
console.log(res);
```
返回一个成功状态的Promise。那么then返回成功状态的Promise，并且成功的状态值就是返回Promise值决定！
```
const res = p.then(value => {
    return Promise.resolve(444);
})
console.log(res);
```
返回一个失败状态的Promise。那么then返回失败状态的Promise，并且失败的状态值就是返回Promise值决定！
```
const res = p.then(value => {
    return Promise.reject(555);
})
console.log(res);
```
返回一个pending状态的Promise。那么then返回的也是一个pending状态的Promise，并且该Promise终态与所返回的Promise终态保持一致。

Promise.prototype.catch()

语法：p.then(reason => {...})

相当于p.then(undefined,reason => {...})的语法糖。

如果回调函数中抛出错误或者返回一个失败状态的Promise，则catch返回的Promise也是失败状态的；否则则是成功状态。

最后是两个常用的函数对象方法。

Promise.all()

语法：Promise.all(.....)

接收的参数是一个可迭代对象，例如一个数组，并且数组中每个元素都是一个Promise实例对象。其返回值是一个新的Promise对象，如果数组中所有Promise都是成功状态，那么所返回的新的Promise也是成功状态，并且成功的状态值是是一个新的数组，该数组中每个元素是对应的数组中每个Promise对象成功的状态值！组要注意的是：主要传入数组中存在失败状态的Promise，那么所返回的新的Promise对象也是一个失败的状态，并且失败的状态值是数组中第一个变为失败状态的Promise的状态值！（注意这里有可能存在异步Promise）

全部成功

const p1 = new Promise((resolve,reject)=>{
    setInterval(()=>{
        resolve(111);
    },1000)
})
const p2 = new Promise((resolve,reject)=>{
    resolve(222);
})
const p3 = Promise.resolve(333);
const res = Promise.all([p1,p2,p3]);
console.log(res);       // 状态为成功，并且成功的状态值是[111，222，333]

存在失败的Promise

const p1 = new Promise((resolve,reject)=>{
    setInterval(()=>{
        reject(111);
    },1000)
})
const p2 = new Promise((resolve,reject)=>{
    resolve(222);
})
const p3 = Promise.resolve(333);
const res = Promise.all([p1,p2,p3]);
console.log(res);         // 状态为失败，并且失败的状态值是111

调用定时器生成失败的Promise

const p1 = new Promise((resolve,reject)=>{
    setInterval(()=>{
        reject(111);
    },1000)
})
const p2 = new Promise((resolve,reject)=>{
    reject(222);
})
const p3 = Promise.resolve(333);
const res = Promise.all([p1,p2,p3]);
console.log(res);           // 状态为失败，失败的状态值是222

Promise.race()

语法：Promise.race(.....)

接收的参数是一个可迭代对象，例如一个数组，并且数组中每个元素都是一个Promise实例对象。返回值由第一个完成的Promise决定，而不是有第一个被调用的Promise所决定。如果数组中最先完成Promise状态为成功，那么该方法所返回的Promise状态也是成功，否则则失败。

全部是同步Promise

const p1 = new Promise((resolve,reject)=>{
    resolve(111);
})
const p2 = new Promise((resolve,reject)=>{
    resolve(222);
})
const p3 = Promise.resolve(333);
const res = Promise.race([p1,p2,p3]);
console.log(res);            // 状态为成功，状态值为111

存在异步Promise

const p1 = new Promise((resolve,reject)=>{
    setInterval(()=>{
        resolve(111);
    },1000)
})
const p2 = new Promise((resolve,reject)=>{
    resolve(222);
})
const p3 = Promise.resolve(333);
const res = Promise.race([p1,p2,p3]);
console.log(res);            // 状态为成功，状态值为222

这里主要介绍了六种常用的方法，更多详细的方法可以参考MDN文档：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise

标签：resolve,const,笔记,res,value,Promise,2Promise,reject
来源： https://www.cnblogs.com/cianbei/p/14842470.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9