[JavaScript知识库]JS顺序执行延时函数的实现

JS顺序执行延时函数的实现

在C语言里，可以按代码前后顺序执行，嵌入式MCU通常是单核CPU运行，且可以通过中断进行代码执行过程控制调整。而PC侧需要CPU进行多任务处理，JS语言是异步执行，如果采用while的方式等待旗语再执行后面代码的方式则会使得系统卡顿。所以等待前面的业务完成再进行后面业务的实现方式不同。

JS顺序执行异步延时函数

JS顺序执行异步延时函数的实现通过如下方式实现，可以延时到特定时间执行后续代码而不会使得系统卡顿:

var i=10;
function delay_exec(){
     if((i--)>0){
          setTimeout(function (){
            console.log(i);
            return delay_exec();

          },1000);
        
     }
     else{
     
        //do things when flag reaches.
        return console.log("end");

     }
}

delay_exec();
console.log("Async running");

这段代码在每个延时1秒时输出倒计数，并在总延时10秒后执行后续代码。可以根据需要调整需要顺序执行的次数。譬如如果不需要每个1秒输出倒计时，则代码变为：

var i=1;
function delay_exec(){
     if((i--)>0){
          setTimeout(function (){
            //console.log(i);
            return delay_exec();
          },10000);        
     }
     else{     
        //do things when flag reaches.
        return console.log("end");
     }
}

delay_exec();
console.log("Async running");

并且，可以在每次延时的执行代码里调整下一次延时的时间，如：

var i=10;
var dt=1000；
function delay_exec(){
     if((i--)>0){
          setTimeout(function (){
          
            console.log(i);
            dt += 1000；
            return delay_exec();
            
          },dt);        
     }
     else{
     
        //do things when flag reaches.
        return console.log("end");

     }
}

delay_exec();
console.log("Async running");

JS顺序执行同步延时函数

采用promise的方式，实现js同步延时函数。基本概念和使用可以参考 使用 Promise 。

把promise和async/await结合起来可以方便实现各类型延时，第一种是内设延时，如：

         function xxx(){
			 return new Promise(function(resolve,reject){
				 resolve("cascade test");
			 })
		 };  
                  
         const yyy = async function(){
		 var rtime = 10;
		 while((rtime--)>0){
		      await xxx().then((value) => {
			           return new Promise(function(resolve,reject){
                              console.log(value);
                              setTimeout(function (){
									resolve(); 
								},2000	)	;	
	                          })
		               })	 
			 
		 }
		 return await function(){
			 return new Promise(function(resolve,reject){
				 resolve();
			 })
		 }(); 	 
		 
	    }
        
        yyy();

第二种是外控延时，如：

         var testnum = 0;
         var runstatus = 0;
	                let syncfun = async function(){
                            while( runstatus == 1 )
						       {
									  await function (){
		                                 return new Promise((resolve, reject) => {
                                             console.log("num: ",testnum++);
											 setTimeout(function (){
												resolve(); 
											 },2000	)	;
										 });
									  }(); 
					            }
		                   return await function(){
			                    return new Promise(function(resolve,reject){
				               resolve();
			                  })
		                    }(); 	                 
					    };
                        
                         runstatus = 1;
                         syncfun();
                         setTimeout(function (){
							runstatus = 0;
						},10000	)	;

–End–