2010-07-23 2 views
6

자바 스크립트에 다중 스레드가 없다는 것을 이해하지만 다음 코드가 손상 될 가능성이 있는지 알고 싶습니다. 내 이해는 setTimeout 또는 AJAX 호출과 같은 비동기 함수가 호출되지 않으면 코드 블록이 실행되기 시작하면 완료 될 때까지 일시 중지하거나 비동기 함수를 호출 할 수 없습니다.두 개의 비동기 Javascript 함수 인스턴스가 동시에 두 블록의 코드를 실행할 가능성이 있습니까?

기본적으로 사용자는 여러 개의 확인란을 선택한 다음 선택 항목의 AJAX 처리를 실행하는 버튼을 클릭합니다. 내 목표는 모든 AJAX 프로세스가 완료 될 때까지만 "Saving ..."아이콘을 유지하고 모두 완료되면 성공 메시지를 표시하는 것입니다.

jQuery.post의 콜백 함수가 중단없이 전체적으로 실행되는 한 if(numProcessed == toProcess)이 두 번 이상 실행되는 방식과 한 번만 실행되는 방식을 볼 수 없습니다. 그러나 두 AJAX 콜백이 콜백 함수에 들어가면 둘 중 하나가 if이되기 전에 numProcessed 카운터를 증가 시키면 코드가 두 번 실행됩니다.

var numProcessed = 0; 
var checkedBoxes = jQuery("input[type=checkbox]:checked"); 
var toProcess = checkedBoxes.size(); 

checkedBoxes.each(function() { 
    jQuery.post('somepage.php',{...},function(results) { 
    numProcessed++; 
    if(numProcessed == toProcess) { 
     jQuery("#saving-message").remove(); 
     jQuery("#feedback-panel").text('Successfully processed all selections.'); 
    } 
    } 
} 
+0

나는 이것을 구현하는 방법을 잘 알고 자바 스크립트 또는 브라우저 실행을 잘 모르겠지만, 당신이 긴/무거운 처리를 수행하는 두 조각의 구현을 완벽하게 통제하고 있다면, 당신은 "process next"함수를 가진 두 개의 객체를 생성 할 수 있으며, 객체 내부의 내부 카운트를 유지하고, 처리가 완료되었음을 알리는 어떤 방법 (다른 함수 또는 "완료"부울)을 가질 수 있습니다. 두 사람 모두 처리가 완료 될 때까지 각자에게 전화하십시오. –

+0

@Merlyn : 체인 연결을 고려한 후에 하나 완료하면 다음 연결이 시작됩니다. 내 관심사는 1) HTML 요청이 모든 대기열에 즉시 도착하기보다는 서버에 도착할 때까지 기다려야하기 때문에 1) 빠른 속도가 아니기 때문입니다. 2) 체인의 한 링크에서 오류가 발생하면 나머지 모든 링크가 처리되지 않습니다. 3) 항목 수에 따라 각 항목에 대해 중첩 된 클로저가 만들어 지므로 스택 오버플로가 발생할 수 있습니다. 내가 틀렸을 수도 있지만 더 복잡한 구조를 만드는 대신 Javascript의 단일 스레드에 의존 할 수있어서 기쁩니다. –

+0

@Merlyn : 귀하의 의견을 다시 읽고, 내 생각보다 계획이 잘 짜여진 것처럼 보입니다. 내 의견에 대한 # 2 및 # 3은 상당히 평이하게 해결되지만, # 1은 여전히 ​​문제 일 수 있습니다. –

답변

2

JavaScript에 스레드가 하나만 있으므로 실행하려는 모든 기능이 스택에 포함되어 다른 모든 기능이 실행될 때까지 기다려야합니다. 귀하의 경우 "each"는 스택의 첫 번째 함수이므로 모든 콜백 함수는 대기해야하며 스택에 넣는 순서대로 실행됩니다. "numProcessed == toProcess"가 한 번만 true 일 수 있습니다.

+0

아주 잘 듣고있어 기쁩니다. Javascript의 단일 스레드 특성에 대해 혼란스럽게 생각하는 것은 이러한 비동기 함수가 있다는 점입니다. 더 큰 의미에서 Javascript에 대해 다중 스레드로 생각하게 만듭니다. 백그라운드 프로세스가 있으며 콜백 실행을 던집니다. 모든 것을 절대적으로 절차 적/동기 적이기보다는 대기열에 넣습니다. –

관련 문제