JavaScript/jQuery의 범위

Question

순수 JS의 범위에 대한 기본적인 이해조차하지 못한다는 것을 깨달았을 때 분명히 너무 많은 CoffeeScript를 작성했습니다. 내가 바로 var에 A = 데이터 '아래 라인 [에 CONSOLE.LOG (A) 문을 넣으면

잠시 동안 연주 후, 나는 following--

$(document).ready(function() { 
    var myUrl = "http://notimportant.com/" 
    var photos = getPhotos(myUrl); 
    console.log(photos);      //undefined 
}); 

function getPhotos(url) { 
    var a; 
    $.get(url, function(data) { 
     a = data["photoset"]["photo"]; 
     console.log(a);      //my object 
    }); 
    return a; 
} 

으로 문제를 알아낼 수 없습니다 "photoset"] [ "photo"]; ' 그것은 내가 찾고있는 GET 요청을 적절히 만들어주는 것을 보여줍니다. 하지만 그 객체를 코드의 주요 블록으로 다시 전달하는 것이 불가능하다는 것을 알고 있습니다.

미리 감사드립니다.

Answer 1

photos이 정의되지 않은 이유는 범위 때문이 아닙니다. 그 이유는 $.get이 비동기 적으로 실행되기 때문입니다. $.get()은 HTTP 응답 대신 jqXHR 객체를 반환합니다.

onSuccess 올바르게 작동하려면 콜백을 getPhotos()으로 전달해야합니다. 또는, when().then() 구조체를 사용할 수있다.

$(document).ready(function() { 
    var myUrl = "http://example.com/"; 
    getPhotos(myUrl, renderCatPhotos);  
}); 

function getPhotos(url, onSuccess) { 
    $.get(url, onSuccess); 
} 

function renderCatPhotos(data) { 
    var a = data.photoset.photo; 
    console.log(a); // a is always available 
} 

참고 : 당신도 getPhotos 기능이 필요하지 않을 수도 있습니다. 대신 $.get(url, onSuccess);을 $(document).ready()으로 간단하게 지정할 수 있습니다.

Answer 2

범위가 아니라 $ .get이 정의되기 전에 정의되지 않은 변수를 반환한다는 점이 중요합니다. 사진을 전역으로 만든 다음 '.'로 설정하는 대신 $ .get 성공 함수로 설정하십시오. 성공 함수 내에서 사진 표시/처리를 제어하는 ​​다른 기능으로 호출 할 수 있습니다.