javascript队列执行池类初探
在业务逻辑中，有时会遇到这样的逻辑，需要按一定的顺序执行一系列方法，而这一系列方法的个数不确定，执行时间是必须等上一个方法执行完，有时需要取消队列中还没有执行的方法，有时需要暂停队列执行，这样功能的一个类如果用javascript实现，我给起个名字叫：javascript队列执行池。
思路:
用一个数组保存要执行的function,定期检查数组,如果有function,按顺序执行每一个function,执行过程中可以通过状态控制执行是否停止.
代码:
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div id="dis"></div>
<div id="play" style="cursor: pointer">开始</div>
<script>
function ExecutePool() {//执行池类
this.executeState = false;//执行状态
this.fnContainer = []; //池容器
var _this = this; //保存this对象
this.addFn = function (fnobj) { //向池里添加方法
_this.fnContainer.push(fnobj);
}
this.reset = function () { //重置
_this.this.fnContainer = [];
_this.executeState = false;
}
this.pause = function () {//暂停
if (_this.executeState) {
_this.executeState = false;
}
}
this.start = function (wt) {//执行 wt:两方法执行间隔时间（毫秒）
_this.executeState = true;
(function () {
if (_this.executeState) {
if (_this.fnContainer.length > 0) {
_this.fnContainer[0]();
_this.fnContainer.shift();
}
window.setTimeout(arguments.callee, (wt || 50));
}
})();
}
}
//测试 1，添加两个方法 2，暂停 3，添加一个方法 4，执行
var xcs = new ExecutePool();
xcs.addFn(function () {
document.getElementById("dis").innerHTML = "aaa";
});
xcs.addFn(
function () {
document.getElementById("dis").innerHTML = "ddd";
});
xcs.start(1000);
xcs.pause();
xcs.addFn(function () {
document.getElementById("dis").innerHTML = '结束';
});
document.getElementById("play").onclick = function () {
xcs.start(1000);
}
</script>
</body>
</html>
后记:
1,动画js库可以用这种模式,使用户不必关心怎么样执行,只改变状态,就自动执行.
2,在添加的方法中如果调用setTimeout方法,顺序会错乱.
3,这是我初步想法,以后完善,如有好的建议给我私信.
4033
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
