learnyounode - 저글링 비동기 - 왜 내 솔루션 작업을하지 않습니까?

Question

learnyounode 워크샵에서 "비공개 비동기"수업에 대한 해결책으로 다음이 왜 작동하지 않는지 설명 할 수 있습니까?

FYI 도움이 될 경우 로그 라인을 남겨 두었습니다. 내 솔루션과 내가 온라인에서 찾은 답변의 근본적인 차이점을 보려고 고심하고 있습니다. https://github.com/olizilla/nodeschooling/blob/master/learnyounode-answers/09-juggling-async.js

미리 감사드립니다! http.get는 비동기이며, "인덱스"변수가 신뢰 할 수있는 경우 https://github.com/olizilla/nodeschooling/blob/master/learnyounode-answers/09-juggling-async.js

urls.forEach(function (item, index) { 
    http.get(item, function (req) { 
    req.setEncoding('utf8') 
    req.pipe(concat(function (res) { 
     data[index] = res; 
     responseCount++ 
     if (responseCount === urls.length) { 
     console.log(data.join('\n')); 
     } 
    })) 
    }) 

:

var urlList = process.argv.slice(2, process.argv.length); 
//console.log(urlList); 
var urlResponseList = {}; 

for(var i=0; i < urlList.length; i++) 
{ 
    urlResponseList[urlList[i]] = ''; 
} 

var http = require('http'); 


console.log(urlList); 

for(var i = 0; i < urlList.length; i++) { 
    //console.log(i); 

    var url = urlList[i]; 

    console.log("1 " + url); 

    http.get(url, function (response) { 
     console.log("2 " + url); 
     console.log("3 " + i); 

     response.setEncoding('utf8'); 

     response.on('data', function (data) { 
      urlResponseList[url] = urlResponseList[url] + data; 
     }); 

     response.on('end', function() { 
      //console.log(stringResponse); 
      //console.log(url); 
      }); 
    }); 
} 
console.log(urlResponseList); 

for(var i=0; i < urlList.length; i++){ 
    console.log(urlResponseList[urlList[i]]); 
} 

나는 또한 내가 온라인 여기에 게시 발견 솔루션에 대한 질문이 있습니다 http.get 콜백은 (foreach 루프에서) 콜백 외부에서 설정 되더라도?

아래의 업데이트 된 솔루션을 게시하고 싶습니다. 모든 도움에 감사드립니다. 내 문제는 클로저가 어떻게 작동하는지 완전히 이해하지 못했기 때문입니다.

var urlList = process.argv.slice(2, process.argv.length); 
//console.log(urlList); 
var urlResponseList = []; 

for(var i=0; i < urlList.length; i++) 
{ 
    urlResponseList.push(''); 
} 

var http = require('http'); 

var responseCount = 0; 

//console.log(urlList); 

urlList.forEach(function(item, index){ 
    //console.log(i); 
    var url = urlList[index]; 

    //console.log("1 " + url); 

    http.get(item, function (response) { 
     //console.log("2 " + url); 
     //console.log("3 " + i); 

     response.setEncoding('utf8'); 

     response.on('data', function (data) { 
      urlResponseList[index] = urlResponseList[index] + data; 
     }); 

     response.on('end', function() { 
      responseCount++; 
      if(responseCount == urlList.length) 
      { 
       //console.log("help"); 
       console.log(urlResponseList.join('\n')); 
      } 
      }); 
    }); 
}); 

//console.log(urlResponseList); 

Answer 1

http.get()는 비동기 적으로 (예를 들어, 언젠가 나중에) 콜백에서 그것의 결과를 반환합니다. 코드 실행은 그 결과를 기다리지 않고 나머지 코드는 아직 응답이 없더라도 계속 실행됩니다.

따라서 모든 요청은 첫 번째 for 루프에서 한 번에 전송 된 다음 두 번째 for 루프가 실행되고 나중에 언젠가는 응답이 도착하고 콜백이 호출됩니다. 귀하의 응답은 비동기식으로 도착하므로 첫 번째 for 루프의 끝에서 사용할 수 없습니다. 따라서 첫 번째 console.log(urlResponseList);은 비어 있고 두 번째 for 루프는 아무 것도 할 수 없습니다.

비동기 응답은 전달되는 콜백 내에서 처리되어야하며, 마지막 응답이 완료 될 때까지 어딘가에 저장해야하며 그 다음에 모든 응답을 처리 할 수 ​​있어야합니다. 비동기 응답 뒤에 문제를 이해하지 않으면

, 이들 두 개의 참조를 읽어

How do I return the response from an asynchronous call?

Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference

---

당신은 또한 콜백 전에 선언 된 지역 변수에 문제가 콜백이 호출되기 전에 변경 될 것입니다.

여기 당신이 for 루프 문제 해결 방법의 예 : 당신은 무엇을 하시겠습니까? JavaScript closure inside loops – simple practical example