각 루프가 완료된 후 함수 실행

Question

안녕하세요, 저는 jQuery each() - ajax 요청을 포함하는 루프와 setTimeout을 처리하고 있습니다. 그것은 저에게 프로그램 흐름에 몇 가지 문제점을줍니다.

xml_queries: function (data) { 
    var values = []; 

    // ... 

    $.each(data, function(index, value) { 

     // ... 

     // Start xml query 
     var i = 0; 
     get_data(value.value); 

     function get_data(value) { 
      $.ajax({ 
       type: 'POST', 
       url: '/admin/scanner/get_music_data/' + value, 
       dataTaype: 'json', 
       success: function(response) { 
        if (response === 'FALSE') { 
         // Start recursion - up to 3 Retries 
         if (++i <= 3) { 
          setTimeout(function() { 
           get_data(); 
          }, 100); 
         } else { 
          // ... 
         } 
        } else { 
         values.push(response); 
        } 
       } 
      }); 
     } 
    }); 
    // return values; 
    console.log(values); 
} 

내 문제 (루프가 계속 데이터를 처리하는 동안)의 마지막 줄에서 CONSOLE.LOG()가 immediatly 소성이다. 루프가 끝날 때까지 기다릴 쉬운 가능성이 없습니까? \ :

감사합니다.

Answer 1

현재 코드를 기반으로 가장 직접적인 방법은 $ .ajax의 async 옵션을 false로 설정하여 동기식 요청을 강제 실행하여 후속 명령문을 계속 실행하기 전에 JavaScript가 완료 될 때까지 기다리게합니다 비동기 요청에 대해서는이 작업을 수행하지 마십시오.

$.ajax(
    { 
    type: 'POST', 
    async: false, 
    ... 

이렇게하면 각 요청이 지속되는 동안 브라우저가 차단됩니다. 그것을 할 수있는 또 다른 방법은 다음 아약스 호출이 최초의 성공 콜백 내에서 호출되도록 응용 프로그램, 예컨대 :

$.ajax(
    { 
    type: 'POST', 
    ... 
    success: function() { 
     doAjaxThingie(); 
    }