외부 대기 클래스를 사용하여 자바 스크립트 함수 실행 일시 중지

Question

자바 스크립트 코드를 매우 쉽게 읽을 수있게하면서 다른 함수를 호출하기 전에 함수 실행을 일시 중지하는 방법을 알아 내려고합니다. 내가에서는 setTimeout을 사용하는 방법에 대한 기사를 수십 읽었습니다

function main_function(){ 
    function a(); 
    // wait for function a to finish - could take 1 second - could take 3 seconds 

    function b(); 
    // wait for function b to finish - don't know how long this will take 

    function c(); 
    // completed 
} 

등 다른 기능, 콜백, 리디렉션하지만 정말 일 해결책을 찾을 수 없습니다 : 여기에 내가 뭘하려고 오전의 예입니다 (그리고 대부분의 사람들은 clunky setTimeout()을 사용하는데, 이것은 각 함수가 얼마나 오래 걸릴지 모르기 때문에 실제로 도움이되지 않습니다).

결국 저는 "WaitThread.js"라는 작은 유틸리티를 발견했습니다. 이것은 정확하게 내가해야 할 일인 것처럼 보입니다. 그리고 나중에 읽고 읽고 유지하기 쉬운 것이 될 것 같습니다.

그러나 사용 방법을 알 수 없습니다. :)

누구나이 WaitThread.js 사용 방법에 대한 예를 제공 할 수 있습니까? 아니면 적어도 하나를 끝내기를 기다리는 동안 자바 스크립트 함수가 순차적으로 실행될 때까지 기다릴 수있는 읽기 쉽고/우아한 방법을 제공 해주겠습니까?

http://www.robertmayo.com/blog/2006/07/htmljavascript-wait-for-asynchronous.html

감사 : 여기

는 WaitThread.js 페이지로 연결되는 링크입니다!

Answer 1

waitthread.js에 대한 설명에 따르면, 타이머를 사용하여 폴링하고 일부 변수의 값 변경을 대기합니다.

이 유형의 문제에 대한보다 일반적인 디자인 패턴은 콜백을 사용하며 function a은 작업 완료시 콜백을 호출하여 function b을 시작합니다. 따라서 function a이 작업을 완료했을 때 호출해야하는 함수를 function a에 전달합니다. 보다 완벽한 디자인 패턴은 일반적으로 성공적인 이탈과 실패한 종료에 대한 콜백을 가지고 있으며 출구에서 매개 변수를 전달할 수도 있습니다. 그러나 구체적인 내용을 모르기 때문에 여기서 모델을 시도하지 않았습니다. 다중 단계 프로세스의 경우, 다음과 같이 표시됩니다. 더 완벽한 솔루션이 가진 개체를 전달할 것

function main_function_step1() { 
    a(main_function_step2); 
} 

function main_function_step2() { 
    // execute code here that goes after function a, but before function b 
    b(main_function_step3); 
} 

function main_function_step3() { 
    // execute code here that goes after function b, but before function c 
    c(main_function_finish); 
} 

function main_function_finish() 
{ 
    // execute whatever code here to finish 
} 

: 우리는, b와 c를 기능과 각 비동기 함수가 완료되면 호출되는 것 인수로 함수를 필요로 세 비동기 기능이 존재한다고 가정 성공 콜백 및 실패 콜백을 반환하고 결과 또는 오류 조건을 반환 할 수 있도록 각 함수에 최소한 하나의 매개 변수를 제공합니다. 이 경우

, 그 결과는 다음과 같습니다

는

function main_function_step1() { 
    function main_function_a_step1_fail(err) 
    { 
    // handle error in step 1 
    } 
    var o = {success: main_function_step2, fail: main_function_a_step1_fail}; 
    a(o); 
} 

function main_function_step2(data) { 
    // execute code here that goes after function a, but before function b 
    function main_function_a_step2_fail(err) 
    { 
    // handle error in step 2 
    } 
    var o = {success: main_function_step3, fail: main_function_a_step2_fail}; 
    b(o); 
} 

function main_function_step3(data) { 
    // execute code here that goes after function b, but before function c 
    function main_function_a_step3_fail(err) 
    { 
    // handle error in step 3 
    } 
    var o = {success: main_function_finish, fail: main_function_a_step3_fail}; 
    c(o); 
} 

function main_function_finish(data) 
{ 
    // execute whatever code here to finish 
} 

이 코드를 좀 지저분이지만, 더 폴링 또는 전역 변수를 필요로하지 않는다. 만약 단계들 사이에서 실행할 코드가없고 그것들 사이의 로직이 모두 같다면, 데이터 구조의 모든 것을 파라미터 화하고 데이터 구조에서 하나의 항목 만 실행하고 다음 단계를 통과하는 단일 함수로 모든 단계를 실행할 수 있습니다 콜백으로서의 값 등등.