js 延期执行_js在循环中 延迟执行 该如何写

简介: js 延期执行_js在循环中 延迟执行 该如何写
setTimeout 对题主理解造成了影响,重新写了一个demo。

//老规则,为了方便复制,TaskControl 再写一遍

//创建任务控制类

var TaskControl = function(taskFunction, finishFunction){

this.finish = false;

this.next = function(){

if( !this.finish ){

taskFunction.call(this);

}else{

finishFunction.call(this);

}

};

};

//老规则,为了方便复制,TaskControl 再写一遍:结束

//任务

var task = function(){

this.index++;

//判断列表中还有没有任务

if( this.index >= this.data.length ){

this.finish = true;

//继续下一个,触发完成

this.next();

}else{

console.time("任务:" + this.index);

//如果还有任务,开始处理任务

this.cache.push({

url : "/q/" + this.data[this.index],

index : this.index,

start : new Date()

});

$.get(this.cache[this.index].url, (function(html){

this.cache[this.index].finish = new Date();

this.cache[this.index].htmlsize = html.length;

console.log(this.cache[this.index]);

console.timeEnd("任务:" + this.index);

//继续下一个

this.next();

}).bind(this));

}

};

var finish = function(){

console.log("任务完成");

console.table(this.cache);

};

var run = new TaskControl(task, finish);

//为了测试方便,将数据也绑定过来

run.data = ["1010000007271957", "1010000003115114", "1010000007271957"];//列表

run.index = -1; //默认索引

run.cache = []; //设置个执行缓存

run.next(); //开始执行

以下是老答案

使用setTimeout。

您确定 1秒内能执行完吗?(如果执行不完,接着多任务执行,CPU过高)

您确定 1秒内执行不完吗?(0.1秒能完成,干嘛每次都要等一秒)

为什么 导入完 一个任务后,接着再执行 下一个导入任务,而不是靠猜测,去 隔 一秒 执行一次呢?

不用担心无尽的callback,一个简单的控制类,就可以完成这么简单的工做,参考了Promise的思想。

//创建任务控制类

var TaskControl = function(taskFunction, finishFunction){

this.finish = false;

this.next = function(){

if( !this.finish ){

taskFunction.call(this);

}else{

finishFunction.call(this);

}

};

};

完成的简单的代码

//为了方便复制,TaskControl 再写一遍

//创建任务控制类

var TaskControl = function(taskFunction, finishFunction){

this.finish = false;

this.next = function(){

if( !this.finish ){

taskFunction.call(this);

}else{

finishFunction.call(this);

}

};

};

//为了方便复制,TaskControl 再写一遍:结束

//任务

var task = function(){

//deal不知道你怎么定义的,估计是异步的,这里用setTimeout实现

var deal = function(){

//异步执行了

this.index++;

console.time("任务:" + this.index);

//判断列表中还有没有任务

if( this.index >= this.data.length ){

//设置 finish 为 true

this.finish = true;

}else{

//如果还有任务,开始处理任务

var runLog = {

"时间" : new Date(),

"索引" : this.index,

"值" : this.data[this.index]

};

console.log(runLog); //每次执行日志

this.cache.push(runLog);

}

console.timeEnd("任务:" + this.index);

//继续下一个

this.next();

}.bind(this);

//setTimeout 是为了模仿异步的效果,随时 时间完成

setTimeout(deal, parseInt(Math.random() * 1000));

};

var finish = function(){

console.log("任务完成");

console.table(this.cache);

};

var run = new TaskControl(task, finish);

//为了测试方便,将数据也绑定过来

run.data = ["任务开始倒计时" ,"10", "9", "0", "开始了吗?", "还没结束吗?", "列表中最后一个任务!"]; //列表

run.index = -1; //默认索引

run.cache = []; //设置个执行缓存

run.next(); //开始执行
相关文章
|
2月前
|
JavaScript 前端开发
JS循环for、for...of、for...in
本文介绍了JavaScript中不同的循环语句,包括传统的`for`循环、`for...of`循环用于遍历数组和类数组对象、`for...in`循环用于遍历对象的属性,并通过示例代码展示了它们的用法和区别。
43 6
JS循环for、for...of、for...in
|
2月前
|
JavaScript 前端开发
JavaScript基础知识-流程控制之while循环
这篇文章介绍了JavaScript中的while循环和do...while循环的基础知识,并通过一个实际案例演示了如何使用while循环计算投资增长到特定金额所需的年数。
50 2
JavaScript基础知识-流程控制之while循环
|
1月前
|
JavaScript 前端开发
js循环有几种
js循环有几种
31 0
|
3月前
|
JavaScript 前端开发
JavaScript中有哪几种循环?他们的运用场景在哪?
JavaScript中有哪几种循环?他们的运用场景在哪?
|
3月前
|
JavaScript 前端开发 索引
js的循环中foreach、for in和for of的区别
js的循环中foreach、for in和for of的区别
143 0
|
11天前
|
JavaScript
js动画循环播放特效源码(上班族的一天)
js动画循环播放特效是一段实现了包含形象的卡通小人吃、睡、电脑工作的网页动画,js循环动画,简单的画面设计。非常丝滑有意思,欢迎对此代码感兴趣的朋友前来下载参考。
22 2
|
2月前
|
前端开发 JavaScript
前端基础(八)_JavaScript循环(for循环、for-in循环、for-of循环、while、do-while 循环、break 与 continue)
本文介绍了JavaScript中的循环语句,包括for循环、for-in循环、for-of循环、while循环、do-while循环以及break和continue的使用。
51 1
前端基础(八)_JavaScript循环(for循环、for-in循环、for-of循环、while、do-while 循环、break 与 continue)
|
2月前
|
JavaScript 前端开发 索引
|
2月前
|
JavaScript 前端开发
JavaScript基础知识-forEach循环
关于JavaScript基础知识中forEach循环的介绍。
42 1
JavaScript基础知识-forEach循环
|
1月前
|
JavaScript
自动循环提交js
自动循环提交js
17 0