Js使用Promise实现阻塞任务

        业务背景，在付款码支付的场景中，用户亮码收银人员扫码下单，这个时候会出现用户来不及输密码，后端的接口已经返回数据，后端返回数据的响应码是非成功状态时候页面的弹框无法自动关闭，这个时候需要前端取轮询后端接口，查询支付状态，根据支付状态自动关闭弹框。传统方式使用setTimeout配合回调函数，定时轮询，这种方式对于轮询次数无法控制，且还要处理定时器清除的等诸多问题，今天尝试使用Promise一步编程实现。

一、LoopSleep类定义

class  LoopSleep{
   constructor(sec,count) {
     this.sec = sec  ///阻塞时长 秒
     this.count = count /// 任务执行次数
   }
   
    /**睡眠函数*/
   sleep() {
     return new Promise(resolve => setTimeout(resolve,this.sec));
   }
    
   /**异步函数调用  async与await 要承兑出现  */        
   async  handleApi(callback){         
      console.log("handleApi--start->"+(new Date()));          
      for (let i=0;i<this.count;i++){
         await this.sleep()
         console.log("指行轮询第"+i+"次")
         //执行业务的函数
          callback()
      }          
      console.log("handleApi--end->"+(new Date()));
   }
}

二、模拟调用

let httpGetData=()=>{
   ///调用后端接口         
   /// console.log("调用接口处理页面逻辑");        
}

/// 睡眠5s,轮询6,整个过程耗时30s
let loopSleep = new LoopSleep(5000,6)
loopSleep.handleApi(httpGetData)  

       30s轮询任务执行完毕