2011-02-10 4 views
5

나는 많은 기능을 연속적으로 실행해야하지만 다른 기능이 완료되기 전에는 실행하지 않아도됩니다. 필요한 기능은 이전 기능이 성공적으로 완료된 후에 만 ​​실행되도록 대기열에 넣는 방법입니다. 어떤 아이디어?JavaScript 기능 대기열

Function1(); 
Function2(); 
Function3(); 
Function4(); 
Function5(); 
+0

귀하의 코드는 잘 작동한다는 ... (기준이 "성공적으로 완료"당신은 함수가 반환 된 것을 의미) –

+1

은 비동기 물건이 당신의 기능에 있습니까? 그렇지 않은 경우 문제가 발생하지 않습니다. – spender

+0

대부분의 함수에는 AJAX 호출이 포함되어 있습니다. 그리고 각각은 이전 호출의 성공 여부에 달려 있습니다. – user610728

답변

0

커버링 기능으로 나열한 이유는 무엇입니까? 함수는 AJAX 호출이 포함 된 경우

function do_1_to_5() { 
    Function1(); 
    Function2(); 
    Function3(); 
    Function4(); 
    Function5(); 
} 

는, 당신은 AJAX 호출을 처리하는 콜백 함수의 끝 부분을 연결해야합니다.

+0

바로 그게 바로 jquery의 $ .ajax 호출 성공 콜백에 다음 함수를 넣는 것입니다. 방금 더 나은 해결책이 있다고 생각했습니다. – user610728

0

당신이 다음 중 하나에 값을 반환 각각의 사용에서 값을 반환 할 수 있습니다, 그들은 연속적으로 실행되었는지 확인하려면 ...

function do_1_to_5() { 

    r1 = Function1(); 
    r2 = Function2(r1); 
    r3 = Function3(r2); 
    r4 = Function4(r3); 
    r5 = Function5(r4); 

} 
당신이 뭔가를 사용할 수
7

:

var FunctionQueue = (function(){ 
    var queue = []; 
    var add = function(fnc){ 
     queue.push(fnc); 
    }; 
    var goNext = function(){ 
     var fnc = queue.shift(); 
     fnc(); 
    }; 
    return { 
     add:add, 
     goNext:goNext 
    }; 
}()); 

과는 다음과 같이 사용 : 몇 년 후

var fnc1 = function(){ 
    window.setTimeout(function(){ 
     alert("1 done"); 
     FunctionQueue.goNext(); 
    }, 1000); 
}; 

var fnc2 = function(){ 
    window.setTimeout(function(){ 
     alert("2 done"); 
     FunctionQueue.goNext(); 
    }, 5000); 
}; 

var fnc3 = function(){ 
    window.setTimeout(function(){ 
     alert("3 done"); 
     FunctionQueue.goNext(); 
    }, 2000); 
}; 

FunctionQueue.add(fnc1); 
FunctionQueue.add(fnc2); 
FunctionQueue.add(fnc3); 
FunctionQueue.goNext(); 

편집 :,536,913 사람들이 이것을 접근하는 또 다른 방법은 체인을 계속하기 위해 호출 할 수있는 next 함수를 전달하는 것입니다. 그래서 같이 :

var Queue = function(arr){ 
    var index = 0; 
    var next = function(){ 
     if (index >= arr.length) {return;} 
     arr[index++](next); 
    }; 
    return next; 
}; 

var fn1 = function(next){ 
    console.log("I am FN1"); 
    next(); 
}; 

var fn2 = function(next){ 
    console.log("I am FN2"); 
    setTimeout(next,1000); 
}; 

var fn3 = function(next){ 
    console.log("I am FN3"); 
    setTimeout(next,3000); 
}; 

var fn4 = function(next){ 
    console.log("I am FN4"); 
    setTimeout(next,1000); 
}; 

Queue([fn1, fn2, fn3, fn4])(); 
5

당신은 대기열 기능을 만들 수 있습니다 그래서

function Queue(arr) { 
    var i = 0; 
    this.callNext = function() { 
     typeof arr[i] == 'function' && arr[i++](); 
    }; 
} 

이러한 당신의 기능 ...

function f1() { 
    alert(1); 
} 

function f2() { 
    alert(2); 
} 

function f3() { 
    alert(3); 
} 

... 당신은 그냥 통과 (자신의 참조 인 경우)를 새 대기열 인스턴스 내부에 생성합니다.

var queue = new Queue([f1, f2, f3]); 

그런 다음 함수를 순차적으로 호출 할 callNext()을 실행

queue.callNext(); 
queue.callNext(); 
queue.callNext(); 

라이브 데모 :http://jsfiddle.net/CEdPS/3/

0

당신은 단지 배열에 기능을 넣어, 모든 기계가 필요하지 않습니다를. 그런 다음 반복 할 수 있습니다.

var runThese = [ 
    Function1, 
    Function2, 
    Function3, 
    Function4, 
    Function5 
]; 

자바 스크립트는 단일 스레드이므로 다음 시작 전에 하나의 완료가 보장됩니다. 그들은 비동기 또는 한 후 실행 있도록이 기능을 체인 메커니즘을 제공 -

for (var i = 1; i <= 5; i++) { 
    window["Function" + String(i)](); 
} 
+0

각 함수가 이전 함수에서 비동기를 기다려야한다는 주석을 보지 못했습니다. 결국 이것은 당신이 필요로하는 것이 아닙니다. 함수의 내용을 알지 못해도 문제에 올바르게 대답 할 수는 없습니다. – jpsimons

0

체크 아웃 async.js :

for (var i = 0; i < runThese.length; i++) { 
    runThese[i](); 
} 

아니면 기능이 결정적 이름을 가지고 있기 때문에, 당신은 모두 배열을 피할 수

다른 하나는 실행 된 모든 기능에서 결과 및/또는 오류를 잡을 수있는 훌륭한 방법입니다.

https://github.com/caolan/async

관련 문제