美文网首页
Promise的整理

Promise的整理

作者: 十年之后_b94a | 来源:发表于2020-03-19 10:04 被阅读0次

    Promise语法用了很久,还没有好好整理过。

    语法

    new Promise((resolve,reject)=>{})其中resolve代表执行成功返回的,reject执行失败返回的

    实例 1、

    function t(){
      return new Promise((resolve,reject)=>{
        setTimeout(()=>{
          try{
               let ran = parseInt(Math.random() * 10);
              ran < 5 ? resolve(true) : resolve(false);
          }catch(e){
              reject(e);
          }
        },parseInt(Math.random() * 301 + 200)) //200~500
      })
    }
    
    //使用:
    t()  //链式调用
    .then(res=>{})
    .catch(e=>{})
    

    值得注意的是:当执行了resolve函数时,后面的语句都不会在执行
    ran < 5 ? resolve(true) : resolve(false);在这一段语句后面添上其他语句,并不会执行

    Promise.all与Promise.race的区别

    Promise.all顾名思义它会等待所有的Promise的状态变为resolve成功那么才会执行.then,并且它会返回所有的Promise的resolve的值
    Promise.race它只会捕获优先执行完成的那一个Promise的resolve的值,但是其他的Promise还是会执行,但是捕获不到值了

    function t(){
      return new Promise((resolve,reject)=>{
         setTimeout(()=>{
          try{
               let ran = parseInt(Math.random() * 10);
                console.log("执行了")
               resolve(ran );
          }catch(e){
              reject(e);
          }
        },parseInt(Math.random() * 301 + 200)) //200~500
      })
    }
    
    let arr = Array.from({length:10}).fill(t);//填充十个Promise待执行函数
    
    Promise.all(arr.map(item=>item()))
    .then(res=>{
        console.log(res)
    })
    .catch(e=>{
        console.log(e)
    })
    

    执行结果

    image.png
    由此可见Promise.all它会执行完所有的Promise函数才执行返回
    Promise.race(arr.map(item=>item()))
    .then(res=>{
        console.log(res)
    })
    .catch(e=>{
        console.log(e)
    })
    

    执行结果

    image.png
    由此可见Promise.race它只会捕获优先返回的那个值,但是其他的Promise不会因此而放弃执行

    引入async/await

    让语法更趋向与同步

    function t(){
      return new Promise((resolve,reject)=>{
         setTimeout(()=>{
          try{
               let ran = parseInt(Math.random() * 10);
                console.log("执行了")
               resolve(ran );
          }catch(e){
              reject(e);
          }
        },parseInt(Math.random() * 301 + 200)) //200~500
      })
    }
    
    (async ()=>{
      let result = await t();
      //、、、dosome
    })()
    

    那么result就是函数的resolve返回值
    如何捕获异常?那么只能借助于try{}catch(e){}

    (async ()=>{
      try{
        let result = await t();
      }catch(e){
        //异常处理
      }
    
      //、、、dosome
    })()
    

    思考如果我不用try catch如何捕获异常?

    function t(){
      return new Promise((resolve,reject)=>{
        setTimeout(()=>{
            let ran = parseInt(Math.random() * 10);
            ran <= 5 ? resolve(true) : reject(new Error("错误了"));
        },parseInt(Math.random() * 301 + 200)) //200~500
      })
    }
    (async()=>{
        let d = await t().catch(e=>{return e});
                
            console.log(typeof d) 
    })()
    

    我只要区分d是boolean 还是object我就能知道是错误还是正确执行,并不会中止代码执行

    相关文章

      网友评论

          本文标题:Promise的整理

          本文链接:https://www.haomeiwen.com/subject/ejrkyhtx.html