js_javascript 기술 아래에 이벤트 큐 작업 함수 작성

KEQueue —— 이벤트 대기열
@Author ake by 2010-04-25
http://www.cnblogs.com/akecn

@param data 이벤트 대기열의 각 이벤트는 해당 값이 KEQueue.status를 통해 수정되지 않는 한 이 매개변수를 첫 번째 매개변수로 전달하십시오.
@method next(Function) 다음에 실행할 이벤트입니다.
@method wait(Number) 다음 이벤트를 실행하기 전에 일정 시간 동안 대기합니다.
@method sleep()은 이벤트 시퀀스 실행을 중지합니다.
@method wake()는 일련의 이벤트를 계속합니다.
**/
var KEQueue = function(data) {
this.staticQueue = [];
this.asyncQueue = [ ];
this.status = "실행 중";
this.result =
return this; {
next:function(callback, async ) {//메서드 추가
if(!!async) {
this.staticQueue.push("async");//비동기 메서드인 경우 (지연 효과가 있는 메서드), 플래그 추가
this.asyncQueue.push(callback);//지연된 메서드용 저장소 배열
}else {
this.staticQueue.push(callback);/ /직접 트리거된 메소드용 스토리지 배열
}
return this;
},
wait:function(delay) {//지연 실행 순서
var self = this; next(function() {//Delay 메소드 추가 시뮬레이션
setTimeout(function() {
self.wake.call(self)
}, Delay);
},true); 🎜>return this;
},
go:function() {//추가된 순서대로 이벤트를 실행합니다
if(this.staticQueue.length == 0) return;
while(this.staticQueue.length > ; 0) {
if(this.status === "sleep") return

var fun = this.staticQueue.shift()
if(typeof fun == "string" && fun == "async") {
fun = this.asyncQueue.shift()
fun(this.result)
this.sleep( );
}else {
fun(this.result);
}
}
},
sleep:function() {
this.status = "수면" ;
},
wake: function() {
this.status = "running";
this.go()
}


코드를 읽어보시면 이미 이해하셨을 것 같은데요, 어떻게 하는지 코드도 매우 간단합니다.

사실 배열에서 메서드를 실행하는 것은 루프입니다. 배열이 함수가 아닌 경우 대기열 작업은 깨어날 때(wake())까지 중지됩니다. 사용방법도 제가 좋아하는 쪽으로 더 기울어졌네요.

물론 제가 추가한 순서대로 이벤트가 진행되는 걸 방금 봤을 수도 있겠지만, 예상하지 못한 상황이나 이유가 더 많을 것 같아요. 제안이나 의견이 있으시면 메시지를 남겨주세요!

다음은 사용예입니다.

//예제 1 이벤트 추가 및 이벤트 큐 실행
function show(n) {
console.log(n)
}
var o = new KEQueue("0 ");
o.next(function(d) { //매개변수는 생성 중에 전달된 데이터입니다. 전체 이벤트 큐는 해당 데이터를 매개변수로 반환합니다.
show(d 1);
}).next(function(d) {
setTimeout(function() { //지연된 작업 시뮬레이션(비동기 작업)
show(d 2);
o.result = 0; //다음으로 변경 pass 수정되지 않은 경우 데이터는 마지막 이벤트
o.wake(); //시퀀스를 수동으로 깨워야 합니다
},2000), true). (function(d){
show(d 3);
}).go();

o.next(function(d) {
setTimeout(function() { show (d 4);o.wake(); },1000);
},true).wait(1000) //다음 메소드의 실행을 1초 동안 수동으로 지연합니다.
.next(function(d) {
show(d 5);
}).go();

//예제 2
o.next(function() {
show(1);
})
setTimeout(function() {
o.next(function(){
setTimeout(function() {
show(2);
o.wake();
},2000)
},true).go();
},1000)
setTimeout(function() {
o.next(function() {
show (3);
}).go();
},2000);