JavaScript의 동기 호출이 작동하지 않습니다.

Question

나는 리뷰를 포함하여 호텔의 모든 세부 사항을 담은 호텔 페이지를 만들고 있습니다. 호텔 리뷰를 위해 페이지 매기기를하고 싶습니다. 내 코드에서

는 init() 기능을 사용하면 init() 리뷰의 목록을 반환하는 함수 getReviewList를 호출 볼 수 있듯이 등

페이지의 어떤 계산과 같은 초기 계산을 수행하기위한 모든 코드가 포함되어 있습니다. getReviewList()에서 검토 목록 (즉, reviewList.json)을 받기 위해 동기 호출을 생성합니다.

일단 목표 목록을 받으면 모든 계산을 수행 할 수 있습니다. 심지어 나는 setTimeout 함수를 사용하여이 동작이 일정 시간 지연되고 응답이 전역 변수 "reviewList"에 저장됩니다.

그러나은 응답이 전역 변수 "reviewList"에 저장되기 전에 계산 부분이 실행되는 문제가 있습니다. 내가 어디로 잘못 가고 있는지 안내해주세요.

자바 스크립트가 (바이올린 : http://jsfiddle.net/n28SS/)

바이올린이 즉시 때문에

setTimeout(function() { 

     records = oThis.reviewList.length; 
    }, 1000); 

반환 작업 및 기록을 수행하지 않습니다

 getReviewList: function() { 
     var myReq, reqJSON, 
      oThis = this; 
     if(window.XMLHttpRequest) { 
      myReq = new XMLHttpRequest(); 
     } else { 
      myReq = new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     myReq.open("GET", "reviewList.json", true); 
     myReq.send(); 
     myReq.onreadystatechange = function() { 
      if (myReq.readyState == 4) { 
       if (myReq.status == 200) { 
        oThis.reviewList = JSON.parse(myReq.responseText); 

       } 
      } 
     }   
    },       

    init: function() { 
     var oThis = this, 
      records; 

     records = oThis.getReviewList(); 
     setTimeout(function() { 

      records = oThis.reviewList.length; 
     }, 1000); 

     oThis.pages = Math.ceil(records/oThis.itemsPerPage); 
     oThis.inited = true; 
     oThis.attachEventListener(); 
    }, 

Answer 1

불완전한 코드가 포함 = ... 운전 배경은 1000ms 후. 다음 줄은 즉시 실행되므로 레코드에 액세스 할 수 없습니다. oThis.pages=Math.ceil(records/...)

1 초 후에 사용할 수있게됩니다. 당신은 설정 시간 제한 블록으로 모든 코드를 이동하거나 더 나은 아직 비동기 모든 것을 할 수 있습니다 : 나는 코드를 테스트하지 않았습니다

getReviewList: function (callback) {//pass the function that needs to act on list 
    var myReq, reqJSON, 
     oThis = this; 
    if(window.XMLHttpRequest) { 
     myReq = new XMLHttpRequest(); 
    } else { 
     myReq = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    myReq.open("GET", "reviewList.json", true); 
    myReq.send(); 
    myReq.onreadystatechange = function() { 
     if (myReq.readyState == 4) { 
      if (myReq.status == 200) { 
       oThis.reviewList = JSON.parse(myReq.responseText); 
       callback(oThis.reviewList); 
      } 
     } 
    }   
},       

init: function() { 
    var oThis = this, 
     records; 

    records = oThis.getReviewList(function (reviewList) { //Pass the function as a parameter 

     records = reviewList.length; 

    oThis.pages = Math.ceil(records/oThis.itemsPerPage); 
    oThis.inited = true; 
    oThis.attachEventListener(); 
    }); 


}, 

을하지만 기본 개념을 설명한다.