Hri*_*sto 7 javascript queue jquery client-side
我正在研究一个项目,我遇到了一个问题,因为事情并没有按照我希望它们发生的顺序发生.所以我一直在考虑设计某种Queue,我可以用它来组织函数调用和启动期间使用的其他各种JavaScript/jQuery指令,即在页面加载时.我正在寻找的并不一定需要是一个队列数据结构,而是一些能够确保事物以我指定的顺序执行的系统,并且只有当前一个任务完成后,新任务才能开始.
我简要地看了一下jQuery Queue和AjaxQueue,但我真的不知道它们是如何工作的所以我不确定这是否是我想采取的方法......但我会继续阅读有关这些工具的更多信息.
目前,我已经设置好了内部$(document).ready(function() {...});工作,内部发生了其他工作$(window).load(function() {...});.例如,
<head>
<script type="text/javascript">
// I want this to happen 1st
$().LoadJavaScript();
// ... do some basic configuration for the stuff that needs to happen later...
// I want this to happen 2nd
$(document).ready(function() {
// ... do some work that depends on the previous work do have been completed
var script = document.createElement("script");
// ... do some more work...
});
// I want this to happen 3rd
$(window).load(function() {
// ... do some work that depends on the previous work do have been completed
$().InitializeSymbols();
$().InitializeBlock();
// ... other work ... etc...
});
</script>
</head>
Run Code Online (Sandbox Code Playgroud)
......这真的很乏味和丑陋,更不用说糟糕的设计了.因此,而不是处理那些乱七八糟的,我想设计一个漂亮的多功能系统,这样我可以,例如,入队$().LoadJavaScript();,然后var script = document.createElement("script");,然后$().InitializeSymbols();,然后$().InitializeBlock();,等...然后队列将执行函数调用和指令,使得后一条指令完成执行,另一条指令可以启动,直到Queue为空而不是我反复调用dequeue.
这背后的原因是,在开始其他工作之前,需要进行一些工作,例如配置和初始化,因为依赖于配置和初始化步骤已经完成.如果这听起来不是一个好的解决方案,请告诉我:)
我已经为基本队列编写了一些代码,可以在这里找到,但是我想扩展它的功能,以便我可以存储各种类型的"对象",例如单独的JavaScript/jQuery指令和函数调用,基本上我想要执行的代码片段.
UPDATE
使用我实现的当前Queue,看起来我可以存储函数并在以后执行它们,例如:
// a JS file...
$.fn.LoadJavaScript = function() {
$.getScript("js/Symbols/Symbol.js");
$.getScript("js/Structures/Structure.js");
};
// another JS file...
function init() { // symbols and structures };
// index.html
var theQueue = new Queue();
theQueue.enqueue($().LoadJavaScript);
theQueue.enqueue(init);
var LJS = theQueue.dequeue();
var INIT = theQueue.dequeue();
LJS();
INIT();
Run Code Online (Sandbox Code Playgroud)
我也认为我已经想出了如何存储单个指令,例如$('#equation').html("");甚至if-else语句或循环,通过将它们包装起来:
theQueue.enqueue(function() { $('#equation').html(""); // other instructions, etc... });
Run Code Online (Sandbox Code Playgroud)
但是这种方法需要我等到队列完成它的工作才能继续我的工作.这似乎是一个不正确的设计.有更巧妙的方法吗?另外,我怎么知道某个功能已经完成执行,以便队列可以知道继续前进?是否存在某种我可以等待的返回值或者我可以为队列中的每个任务指定的回调函数?
因为我正在做客户端的所有事情而且我不能让Queue独立完成它自己的事情(根据下面的答案),有没有比我等待队列完成其工作更聪明的解决方案?
因为这更像是一个设计问题,而不是特定的代码问题,我正在寻找解决我的问题的方法的建议,关于我应该如何设计这个系统的建议,但我绝对欢迎,并且很乐意看到,代码到备份建议:)我也欢迎任何有关我上面链接的Queue.js文件的批评和/或我对我的问题的描述以及我打算采取的解决方法.
谢谢,Hristo
我建议使用http://headjs.com/它允许您并行加载 js 文件,但顺序执行它们,本质上与您想要做的事情相同。它非常小,你总是可以用它来获取灵感。
我还要提到依赖执行顺序的处理程序不是好的设计。我总是能够将所有引导代码放入就绪的事件处理程序中。在某些情况下,如果您需要访问图像,则需要使用加载处理程序,但对我来说并不常见。
| 归档时间: |
|
| 查看次数: |
2423 次 |
| 最近记录: |