promise使用方法

呵呵的牛

已于 2022-03-09 10:23:11 修改

阅读量131

点赞数 1

分类专栏： js promise 文章标签： js javascript

于 2021-05-11 22:17:00 首次发布

本文链接：https://blog.csdn.net/weixin_43723051/article/details/116673015

版权

js 同时被 2 个专栏收录

28 篇文章 1 订阅

订阅专栏

promise

1 篇文章 0 订阅

订阅专栏

Promise

Promise的好处：解决异步编程，解决回调地狱的问题，具有可读性

1.链式编程

 new Promise((resove,reject)=>{
        setTimeout(function(){
          resove()
        },1000)
      }).then(()=>{
        console.log('123')
        console.log('123')
        console.log('123')
        console.log('123')
      }).then(()=>{
        new Promise((resove,reject)=>{
          setTimeout(function(){
            resove()
          },1000)
        }).then(()=>{
          console.log('234')
          console.log('234')
          console.log('234')
          console.log('234')
          console.log('234')
        }).then(()=>{
        new Promise((resove,reject)=>{
          setTimeout(()=>{
            resove()
          },1000)
        }).then(()=>{
          console.log('345')
          console.log('345')
          console.log('345')
          console.log('345')
          console.log('345')
        })
      })
      })

2.处理异步

// new Promise((resove,reject)=>{
      //   setTimeout(()=>{
      //     resove('aaa')
      //   },1000)
       
      // }).then(res=>{
      //   console.log(res,'第一次') 
      //    return new Promise(resove=>{
      //     resove(res +'123')
      //   })
      // }).then(res=>{
      //   console.log(res,'第二次') 

      //   return new Promise(resove=>{
      //     resove(res + '234')
      //   })
      // }).then(res=>{
      //           console.log(res,'第三次') 
      //           return new Promise(resove=>{
      //             resove(res + '345')
      //           })


      // }).then(res=>{
      //       console.log(res,'第四次') 

      // })
      //链式编程 二次优化
      // new Promise((resolve,reject)=>{
      //   setTimeout(function(){
      //     resolve('aaa')
      //   },1000)
      // }).then(res=>{
      //   console.log(res ,'第一次')
      //   return Promise.resolve(res + '111')
      // }).then(res=>{
      //   console.log(res,'第二次')
      //           return Promise.resolve(res + '222')

      // }).then(res=>{
      //   console.log(res,'第三次')
      //                   return Promise.resolve(res + 		'333')

      // }).then(res=>{
      //   console.log(res,'第四次')
      // })
      //最终优化
      new Promise((resolve,reject)=>{
        setTimeout(()=>{
            resolve('aaa')
          })
      }).then(res=>{
        console.log(res,'第一次')
        return res + '111' 
      }).then(res=>{
        console.log(res,'第二次')
        return res+'222'
      }).then(res=>{
        console.log(res,'第三次')
        return res+'333'
      }).then(res=>{
        console.log(res)
      })

3.异步需求

 //需求两个异步请求完成后 再去 请求第三个请求
    getAsync(){
      // Promise.all里面传的是一个数组
    //  Promise.all([
    //    new Promise((resolve,reject)=>{
    //      setTimeout(()=>{
    //        resolve('result1')
    //      })
    //    }),
    //     new Promise((resolve,reject)=>{
    //      setTimeout(()=>{
    //        resolve('result2')
    //      })
    //    })
    //  ]).then(res=>{
    //    console.log(res) //[result1,result2]
    //  })

     let result = new  Promise((resolve,reject)=>{
       setTimeout(()=>{
         resolve('result')
       },1000)
     })
     let result1 = new  Promise((resolve,reject)=>{
       setTimeout(()=>{
         resolve('result1')
       },1000)
     })
     Promise.all([result,result1]).then(res=>{
       console.log(res)//[result,result1]
     })
    },