Promise 复习

Promise 上的方法分为 静态方法 和 实例方法

模拟一个Promise

const createPromise = (delay, flag = true) => {
            return new Promise((resolve, reject) => {
                setTimeout(() => {
                    // if(flag) {
                    //     resolve(`任务${delay}:成功了`)
                    // } else {
                    //     reject(`任务${delay}:失败了`)
                    // }
                    flag ? resolve(`任务${delay}:成功了`) : reject(`任务${delay}:失败了`)
                }, delay)
            })
        }

 

1. 静态方法

　　1/ Promis.resolve() 　　成功调用

　　 2/ Promise.reject() 　　 失败调用

　　3/ Promise.all()　　　　 所有命令都成功才成功 返回数据的几何 有失败返回失败

Promise.all([createPromise(100), createPromise(5000), createPromise(2000, false)]).then(res=> {
         // [ '任务100:成功了', '任务10000:成功了', '任务2000:成功了' ]
            console.log('res', res)
         }).catch(err=> {
             // 如果有失败的就会出现在这里
             console.log('err',err)
         })

         async await 重构
         const allPromise = async () => {
             try {
                 const res = await Promise.all([createPromise(100), createPromise(5000), createPromise(2000, false)])
                 console.log('res', res)
             }
             catch (error) {
                 console.log('err',error)
         }
        }
        allPromise()

 

　　4/ Promise.allSettled()　所有都完成才成功 返回数据的集合

 Promise.allSettled([createPromise(100, false), createPromise(5000), createPromise(2000)]).then(res=> {
             // [ '任务100:成功了', '任务10000:成功了', '任务2000:成功了' ]
             console.log('res', res)
        }).catch(err=> {
           // 如果有失败的就会出现在这里
             console.log('err',err)
         })

        // async await 重构
        const allSettledPromise = async () => {
            try {
               const res = await Promise.allSettled([createPromise(100), createPromise(5000), createPromise(2000, false)])
             console.log('res', res)
           }
             catch (error) {
                console.log('err',error)
             }
         }
        allSettledPromise()

　　5/ Promise.race()　　　 只触发最先完成的 并且返回他的状态

 Promise.race([createPromise(1000), createPromise(2000)]).then(res => {
             console.log('res', res)
       }).catch(err => {
        //     console.log('err', err)
       })
        // async await 重构
         async function racePromises() {
             try {
                 const result = await Promise.race([
                     createPromise(1000),
                     createPromise(2000, false)
                 ]);
                 console.log('Success:', result);
             } catch (error) {
                 console.log('Error:', error);
             }
         }

         racePromises();

　　6/ Promise.any()　　　  返回第一个成功的结果 如果都失败则返回失败原因

 Promise.any([createPromise(100, false), createPromise(5000, false), createPromise(2000, false)]).then(res=> {
        //     // [ '任务100:成功了', '任务10000:成功了', '任务2000:成功了' ]
        //     console.log('res', res)
        }).catch(err=> {
            // 如果有失败的就会出现在这里
             console.log('err',err)
        })

        // async await 重构
         const anyPromise = async () => {
            try {
                const res = await Promise.any([createPromise(100), createPromise(5000), createPromise(2000, false)])
                 console.log('res', res)
             }
             catch (error) {
                console.log('err',error)
             }
         }
         anyPromise()

 

2. 实例方法

　　1/ Promise.prototype.then()　　成功调用

　　2/ Promise.prototype.catch()　  失败调用

　　3/ Promise.prototype.finally()　 成功失败都会调用