Promise使用

  介绍

         Promise是ES6异步编程的一种解决方案(目前最先进的解决方案是async和await的搭配(ES8),但是它们是基于promise的),从语法上讲,Promise是一个对象或者说是构造函数,用来封装异步操作并可以获取其成功或失败的结果。

        最重要也是最主要的一个场景就是axios请求。通俗来说,由于网速的不同,可能你得到返回值的时间也是不同的,但是我们下一步要执行的代码依赖于上一次请求返回值,这个时候我们就需要等待,结果出来了之后才知道怎么样继续下去。

优点

1.可以避免多层异步调用嵌套问题(回调地狱)
2.Promise 对象提供了简洁的API,使得控制异步操作更加容易(js执行机制导致的异步问题)

状态

Promise对象有三种状态,他们分别是:

1.pending: 等待中,或者进行中,表示还没有得到结果
2.resolved(Fulfilled): 已经完成,表示得到了我们想要的结果,可以继续往下执行
3.rejected: 也表示得到结果,但是由于结果并非我们所愿,因此拒绝执行 
这三种状态不受外界影响,而且状态只能从pending改变为resolved或者rejected,并且不可逆
 

// 当执行resolve方法时 就会执行当前对象下的then方法
 // 当执行reject方法时 就会执行当前对象下的catch方法 

  test() {
    //返回值使用
    this.aa().then(res => {
      console.log('result then', res)
    }).catch(err => {
      console.log('result catch', err)
    })
    //方法内使用
    this.bb()
  }

  aa() {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log('aa settimeout 123')
        resolve(true)
        // 当执行resolve方法时 就会执行当前对象下的then方法
        // 当执行reject方法时 就会执行当前对象下的catch方法
      }, 2000);
    })
  }
  bb() {
    new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log('bb settimeout 123')
        reject(true)
      }, 2000);
    }).then(res => {
      console.log(`bb res:${res}`)
    }).catch(err => {
      console.log(`bb err:${err}`)
    }).finally(() => {
    console.log(`都会执行`)
    })
  }

1.promise的实例方法

then()得到异步任务的正确结果
catch()获取异常信息
finally()成功与否都会执行(尚且不是正式标准)

2.promise的对象方法(p1,p2,p3为promise的实例对象)

①Promise.all()并发处理多个异步任务,所有任务都执行完成才能得到结果

Promise.all( [p1,p2,p3] ) .then ( (result) => {consoleog (result)
})

②Promise.race()并发处理多个异步任务,只要有一个任务完成就能得到结果

Promise.race ( [p1,p2,p3] ).then ( (result)=>{
console. log (result)
})

 总结

1.promise其实就是一个对象或者说是构造函数
2.promise的出现(es6) 就是解决异步编程和回调地狱等问题,async和await的出现(ES8)就是基于promise的一种解决异步编程的终极解决方案(简化代码等等)
 3.在前端中,ajax和axios都会用到异步编程,axios更是基于promise的,所以一定要掌握promise以及用async和await搭配promise的使用

原文链接:https://blog.csdn.net/h18377528386/article/details/122741648

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值