在前台页面上处理大量数据的时候,我们不希望因为数据量过大,处理时间过长,导致UI交互出现卡顿,那这个时候就可以使用时间切片的方式,将一个计算任务进行拆分为一个个独立的小任务,让UI有时间继续响应用户的操作。

先上源代码:

8.31 虽然很努力的维护,但是还是出现了严重的BUG,这版修复。

7.25 修复num参数为1不能执行的错误。

7.24 发布。

/**
 * 这是一个异步队列处理程序
 * @param list {array} 这个必须是数组
 * @param fn {function} 每元素处理的方法,fn默认会传入当前操作的元素以及元素的索引下标
 * @param num {number} 单次处理数量
 * @param scope {object} 作用域
 * @param interval {number} 队列处理间隔时长(单位:毫秒)
 */
function asyncEach(list,fn,num,scope,interval){
	if(!list || list.lengh == 0 || !fn ){
		return;
	}
	var len = list.length,
		num = num || 5,
		scope = scope || this,
		interval = interval || 1,
		start = 0,
		end = len > num ? start + num : len,
		process = function (l,s,e){
			for(var i = s;i < e;i++){
				if(fn.call(scope,list[i],i)===false){
					return;
				}
			}
			if(e == len) return;
			setTimeout(function(){
				process(l,e,len - e > num ? e+num : len);
			},interval);
		};
	process(list,start,end);
}

Logo

瓜分20万奖金 获得内推名额 丰厚实物奖励 易参与易上手

更多推荐