初识Promise(三)API使用(下)

199 阅读2分钟

小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。

promise API使用

上篇API回顾
  • Promise
  • Promise.prototype.then
  • Promise.prototype.catch
  • Promise.resolve
  • Promise.reject
剩余API
  • Promise.all
    • 返回一个新的promise,只有所有promise都成功才成功,否则失败
  • Promise.race
    • 返回一个新的promise,第一个完成的promise结果就是最终的结果状态
  • Promise.allSettled()
    • 返回一个新的promise,在所有promise都完成不限成功或者错误,并带有一个对象数组,每个对象表示对应的promise结果
  • Promise.any()
    • 接收一个Promise可迭代对象,只要其中一个promise成功,就返回成功的promise,如果失败返回一个失败的promise和error的子类,把单一错误集中到一起
  • Promise.prototype.finally()
    • 返回一个新的promise,在promise结束时无论结果成功或者错误都会执行finally,避免在then和catch中各写一次的情况
API示例
        // 新建三个Promise
        const p1 = Promise.resolve(1)
        const p2 = Promise.resolve(1)
        const p3 = Promise.reject(2)

        // Promise all  p1,p2成功返回新的promise,里面有[1,1]的数组
        // 接收一个迭代对象 数组或者字符串
        const pAll = Promise.all([p1, p2])
        // // Promises失败 返回p3的错误
        const pAll = Promise.all([p1, p2, p3])
        pAll.then(
            value => { 
                console.log('onResolve()', value)
             },
            reason => { 
                console.log('onRejected()', reason)
             }
        )

        // Promise race 第一个完成的promise就是最终结果 1
        const pRace = Promise.race([p1, p2, p3])
        // Promises失败 返回p3的错误
        const pRace = Promise.race([p3, p2, p1])
        pRace.then(
            value => { 
                console.log('onResolve()', value)
            },
            reason => {
                console.log('onRejected()', reason)
            }
        )

        // Promise allSettled 返回一个状态数组 
        // [{status: 'fulfilled', value: 1},{status: 'fulfilled', value: 1},{status: '"rejected"', reason: 2}]
        const pAlls = Promise.allSettled([p1,p2,p3])
        pAlls.then(
            value => { 
                console.log('onResolve()', value)
            },
            reason => {
                console.log('onRejected()', reason)
            }
        )

        // Promise any 有一个成功就返回成功 这里返回p1
        const pAny = Promise.any([p1, p2, p3])
        // 失败返回 AggregateError: All promises were rejected
        const pAny = Promise.any([p3])
        pAny.then(
            value => {
                console.log('onResolve()', value)
            },
            reason => {
                console.log('onRejected()', reason)
            }
        )

        // Promise finally 在promise结束时执行 无论成功还是失败 都会执行
        p1.then(
            value => {
                console.log('onResolve()', value)
            },
            reason => {
                console.log('onRejected()', reason)
            }
        )

        p1.finally(()=>{
            console.log('onFinally')
        })

手写Promise前 回顾Promise关键问题

如何改变promise的状态?
  • resolve(value): pedding--> resolved
  • reject(reason): pedding--> rejected
  • 抛出异常(throw new Error): pedding-->rejected
一个promise指定多个成功/失败回调函数,都会调用吗?
  • promise的多个回调都会执行
改变promise状态和指定回调函数执行顺序
  • 先回调函数 后改状态
new Promise((resolve,reject)=>{
    setTimeout(()=>{
        resolve(1) //后改变状态,异步执行回调函数
    },1000)
}).then( //先指定回调函数, 保存当前指定回调函数
    value => {},
    reason => {}
)
  • 先改状态 后回调函数
new Promise((resolve,reject)=>{
      resolve(1) //先改变状态
}).then( //后指定回调函数, 异步执行回调函数
    value => {},
    reason => {}
)
promise.then()返回的新promise的结果状态由什么决定?
  • 由then()回调函数结果决定

总结

  • promise API部分全部更新完,下篇开始更新手写promise
  • 童鞋们,看完文章多敲敲代码练练手哦~