`
teclogid
  • 浏览: 29905 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

真正的js异步执行队列

阅读更多
需要用到一个选择模型角度后,等待250ms的渲染,然后拍照的功能。网上找了找,类似sleep的功能,基本上都是死循环,跳出(还有一些加入时间比较啥的,其实一点用都没有,没有出让cpu,比不比时间没有差别),这种代码一执行,基本上浏览器都会告诉你,脚本执行缓慢,是否取消。唯一的办法,就是用setTimeout模拟。没办法,只能自己写了,很简陋,但功能已具备,有需要可以加以扩展。
var ExecQueue = function() {
	this.queue = [];
};
ExecQueue.prototype = {
	add : function(fn, args, time) {
		this.queue.push( {
			fn : fn,
			args : args,
			time : time
		});
	},
	exec : function() {
		var delay = 0;
		for ( var i = 0; i < this.queue.length; i++) {
			var _this=this;
			var f=function(idx){
				return function(){
				_this.queue[idx].fn.apply(_this,_this.queue[idx].args);
				}
			}(i);
			setTimeout(f, delay);
			delay += this.queue[i].time;
		}
	}
}

function a(){
	alert('a');
}
function b(i){
	alert('b'+i);
}
function c(i,j){
	alert('c'+i+j);
}
var execqueue=new ExecQueue();
execqueue.add(a,[],5000);
execqueue.add(b,['i'],5000);
execqueue.add(c,['c1','c2'],5000);
execqueue.add(c,['c3','c4'],2000);
execqueue.exec();
分享到:
评论
4 楼 teclogid 2011-04-15  
dong87 写道
用我的发放解决之后发现doWork()的执行间隔无法控制,不是按设定的1000执行的,好像是按前面的500执行的

这个异步队列是最简单的情形,不支持动态的add,如果执行过程中,需要动态add,需要修改一下add方法
3 楼 dong87 2011-04-06  
用我的发放解决之后发现doWork()的执行间隔无法控制,不是按设定的1000执行的,好像是按前面的500执行的
2 楼 dong87 2011-04-06  
发现是执行新一轮操作的时候没有清空列队导致的
每次执行doWork()时候先清空一下可以解决,但不够优雅,求优雅点的解决方案

function doWork() {
execqueue.queue = []; // <---------加上这句就好了
document.write("<br/><br/>新一轮执行:<br/>");
for (var i=1; i<=3; i++) execqueue.add(writeSth,[i],500);
if (counter++ < 3) execqueue.add(doWork,[],1000);
execqueue.exec();
}
1 楼 dong87 2011-04-06  
您好,当我用如下代码测试的时候,发现程序进入了死循环,不知该如何解决
var execqueue=new ExecQueue(),counter = 0; 
function doWork() {
document.write("<br/><br/>新一轮执行:<br/>");
for (var i=1; i<=3; i++) execqueue.add(writeSth,[i],500);
if (counter++ < 3) execqueue.add(doWork,[],1000);
execqueue.exec();
}
function writeSth(theWord) {
document.write(theWord + "<br/>");
}
doWork();

相关推荐

    前端面试题+异步队列最大执行队列+javascript+异步队列

    求异步队列的最大执行队列,JavaScript中有多个异步请求,每次最多执行n个(10个),实现一个函数,使每次执行都是最大队列 。 { this.tasks = []; this.max = 10; setTimeout(() =&gt; { this.run(); }); }...

    asyncfnqueue一个异步函数队列化执行库

    async-fn-queue:一个异步函数队列化执行库

    JavaScript队列函数和异步执行详解

    读了这篇文章之后,发现还可以用在异步执行等。 假设你有几个函数fn1、fn2和fn3需要按顺序调用,最简单的方式当然是: fn1(); fn2(); fn3(); 但有时候这些函数是运行时一个个添加进来的,调用的时候并不知道都...

    JS异步宏队列微队列原理详解

    JS 中用来存储待执行回调函数的队列包含 2 个不同特定的列队 宏列队:用来保存待执行的宏任务(回调),比如:定时器回调、DOM 事件回调、ajax 回调微 列队:用来保存待执行的微任务(回调),比如:promise的回调...

    JS异步宏队列与微队列原理区别详解

    JS 中用来存储待执行回调函数的队列包含 2 个不同特定的列队 宏列队:用来保存待执行的宏任务(回调),比如:定时器回调、DOM 事件回调、ajax 回调 微列队:用来保存待执行的微任务(回调),比如:promise的回调...

    浅谈Vuejs中nextTick()异步更新队列源码解析

    vue官网关于此解释说明如下: vue2.0里面的深入响应式原理的异步更新...Vue 在内部尝试对异步队列使用原生的 Promise.then 和 MutationObserver,如果执行环境不支持,会采用 setTimeout(fn, 0) 代替。 例如,当你设置

    async-limit-queue:创建并发受限的异步功能队列的小帮手

    异步限制队列无依赖项的小帮手,以有限的并发性创建异步功能队列。描述当您要执行一堆异步函数并希望限制并发执行的函数数时,请使用此模块。 该模块导出一个函数,该函数创建具有给定并发限制的队列实例。 使用push...

    git-job-queue:一个node.js模块,实现一个异步作业队列以执行git命令

    git-job-queue 一个node.js模块,用于实现一个异步作业队列以执行git命令。

    详解如何构建Promise队列实现异步函数顺序执行

    主要介绍了详解如何构建Promise队列实现异步函数顺序执行,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

    一段JavaScript代码是如何执行的

    一段JavaScript是如何执行的js事件循环异步任务异步任务队列测试代码结果调试执行结果 js事件循环 当我们执行一行js代码时,如果是同步任务,就把它直接放到执行栈里面去执行,如果是异步任务,会把它放到一个异步的任务...

    rygr.async-queue:Rygr Util 使用的异步队列机制

    要求 asyncQueue = require ' rygr.async-queue ' 或者,在 JavaScript 中 asyncQueue = require ( 'rygr.async-queue' )依赖关系对于浏览器构建,异步队列依赖于jQuery 对于节点构建,异步队列依赖于q 这些依赖项...

    htq:HTQ ,全称 Http Task Queue ,是一个以Http方式执行异步任务的队列服务

    一、什么是 HTQ 先介绍下基本概念。...HTQ ,全称 Http Task Queue ,是一个以Http方式执行异步任务的队列服务。你可以推送若干url进HTQ队列,HTQ会以Http GET 的方式访问这些url。如果url所在的脚本写上各种具体的

    celery.node:Node.js的Celery任务队列客户端工作器

    任务队列任务队列是一种在“工人”或“机器”之间分配或分派“任务”或“工作”以异步执行它们的机制。 任务队列的常见用例: 视频编码与解码调整图片大小处理批量更新任何可以异步执行的任务 应用程序(也称为...

    深入理解JS异步编程-Promise

    “JS 是基于单线程事件循环”的概念构建的,回调函数不会立即执行,由事件轮询去检测事件是否执行完毕,当执行完有结果后,将结果放入回调函数的参数中,然后将回调函数添加到事件队列中等待被执行。 同时也讲了回...

    nbqueue:用于在 node.js 中执行异步函数的超级简单队列模块

    用于在 node.js 中执行异步函数的超级简单队列模块。 安装 npm install nbqueue 用途 限制正在执行的函数数量 异步访问大量文件时,可能会发生不好的事情。 例如,选择一个包含 20,000 个文件的目录并尝试一次访问...

    timeoutqueue:异步执行功能

    timeoutqueue-异步执行功能一个用于异步执行功能的简单库。 队列中的所有功能执行完毕后,将调用完成的回调。

    nest-queue:NestJS应用程序的队列包

    轻松将队列轻松集成到您的nestjs应用程序中介绍队列是后端体系结构中使用的异步服务到服务通信的一种形式。 它们可用于取消耦合或推迟繁重的处理,例如发送邮件,处理大型数据库操作等。消息在处理之前一直保留在...

Global site tag (gtag.js) - Google Analytics