다른 기능을 완료 한 후에 Javascript 기능을 시작하는 방법은 무엇입니까?

Question

몇 가지 다른 기능을 실행하고 내 웹 페이지에 콘텐츠를로드 한 후 일련의 기능을 실행하려고합니다. 나는 setTimeOuts을 사용했으나 연결이 지연 될 수 있다는 점을 감안할 때 잘못된 실행이라고 생각합니다.이 경우 연결이 잘못 실행됩니다. setTimeOuts을 사용하지 않고 함수를 순차적으로 어떻게 수행합니까?

avgEmotion 및 avgSentiment 기능은 newsApiLeft() 및 newsApiRight() 기능을 통해 한 번에 일련의 목록은 웹 페이지에 생성되어 실행되어 있습니다.

미리 감사드립니다. 당신이 Left 및 Right에 동일한 콜백을 사용하는 경우에는 콜백을 절약 할 수있다,

function newsApiLeft(callback) { 
    // Load stuff 

    // Then call the callback; the code you want 
    // to run after the loading is complete 
    callback(); 
} 

newsApiLeft(function() { 
    avgEmotion(); 
    avgSentiment(); 
}); 

모두를 위해 그것을 사용 :

button.addEventListener("click", function() { 
    var filter = document.getElementById("news_cat"); 
    var filterSource = document.getElementById("news_source"); 
    var category = filter.value; 
    var source = filterSource.value; 
    params.sources = source; 
    params.q = category; 
    parameters.q = category; 

    var filterL = document.getElementById("news_sourceL"); 
    var sourceL = filterL.value; 
    parameters.sources = sourceL; 

    showContent(); 
    clearTextRight(); 
    clearTextLeft(); 

    newsApiLeft(); 
    newsApiRight(); 

    setTimeout(avgEmotionR, 2000); 
    setTimeout(avgEmotionL, 2000); 
    setTimeout(avgSentiment, 2000); 
}) 

Answer 1

이 사용하는 콜백을 달성 할 수

var callback = function() { 
    avgEmotion(); 
    avgSentiment(); 
} 

newsApiLeft(callback); 
newsApiRight(callback); 

Answer 2

다른 호출 (비동기 호출)이 반환 된 후에 함수를 실행하는 올바른 방법은 Promises을 사용하는 것입니다. 약속을 반환하여 newsApiLeft() 및 newsApiRight 기능을 확인 한 다음 원하는 호출하는 것은 다음과

var newsApiLeft = new Promise(function(resolve, reject) { 
    // do something long running 
    let everythingWasOK = true; 

    if (everythingWasOK) { 
    resolve("I can return a value"); 
    //or just resolve(); 
    } else { 
    reject(Error("Or error")); 
    } 
}); 

newsApiLeft.then((returnedData)=>{ 
    avgEmotionL(); 
    //run another function here; 
    //you can use the returnedData 
}, (error)=>{ 
    //optionally handle error 
}) 

Answer 3

당신이 사용하는 자바 스크립트 약속 얻을 수 있습니다.

여기서 나는 Promise A를 만들었는데, 여기에서 아래에 언급 된 논평에서 논리 처리를 수행합니다. 그런 다음 논리를 기반으로 해결하거나 거부해야합니다. 해결하면() 함수가 호출됩니다.

첫 번째 then() 함수에서 새로운 약속을 중첩 할 수 있습니다. 현명한 것처럼 당신은 원하는만큼 중첩시킬 수 있습니다. 당신이 확실 약속 B를 만들 수 있습니다이 방법은 약속을 실행에 대해서만 약속 A.

var A = new Promise(function(resolve, reject) { 

    // Do an async task here and then... 

    if(/* good condition */) { 
     resolve('Success!'); 
    } 
    else { 
     reject('Failure!'); 
    } 
}); 

A.then(function() { 
    /* do something with the result */ 
}).catch(function() { 
    /* error :(*/ 
}) 

의 종료 후 실행하는 바로 할 A();