JSON 데이터 및 함수

Question

그래서 JSON 데이터를 전달하는 데 문제가 있습니다.

function getFooterContent(){ 
//ajax call to get json file 
$.getJSON("scripts/pageData/footer/footerData.json", function(jsonData){ 
    console.log(jsonData); 
    return jsonData; 
}).fail(function(){ 
    console.log("fail");  
    return -1; 
}); 

//Return the json file 
} 

function someFunction(){ 
    var someContent = new Object(); 
someContent = getFooterContent(); 
console.log(someContent); 
} 

그래서 지금 JSON 파일을 호출하고 있습니다. 그리고 내가 console.log (jsonData)를 쓸 때 Object가 생겼다. 그럼 내가 할 수 있는게있어 .Content. jsonData가 someFunction에 반환되고 console.log (someContent)가 정의되지 않은 경우에도 발생합니다. 나는 이해하지 못한다. 나는 getJSON 함수와 같은 객체라고 생각했다.

Answer 1

이것은 $.getJSON이 비동기식이기 때문에 발생합니다. 따라서 getFooterContent()이 반환되면 해당 시점에 JSON 데이터가 아직 검색되지 않았으므로 undefined입니다.

getFooterContent() 대신 promise 개체가 있어야합니다.

function getFooterContent() { 
    var promise = $.getJSON("url"); 
    return promise; 
} 

function someFunction() { 
    var promise = getFooterContent(); 
    var outsideCopy; 

    promise 
    .done(function(data) { 
     outsideCopy = data; 
     console.log(outsideCopy); 
    }) 
    .fail(function(e) { 
     console.log('Error'); 
     console.log(e); 
    }); 
} 

위의 예는 변수 선언을 제거하여 단축 할 수 있습니다. 코드를 쉽게 이해할 수 있도록 코드를 남겨 두었습니다.

Answer 2

getJSON은 비동기 적으로 호출되므로 예상 한 결과를 얻지 못할 수 있습니다.

설명해 드리죠 :

function getFooterContent(){ 
//ajax call to get json file 
$.getJSON("scripts/pageData/footer/footerData.json", 
    function(jsonData){ // This function is executed when request is ready and server responds with OK 
    console.log(jsonData); 
    return jsonData; 
}). 

fail(function(){ // This when servers responds with error 
    console.log("fail");  
    return -1; 
}); 

//Return the json file 
// You are returning undefined actually 
} 

function someFunction(){ 
    var someContent = new Object(); 
someContent = getFooterContent(); 
console.log(someContent); 
} 

을 당신이 필요합니다

여기

function someFunction(){ 
    var someContent = new Object(); 
    getFooterContent(function(someContent){ 
     // someContent is passed by getFooterContent 
     console.log(someContent); 

    }); 
} 

은 당신이 당신의 함수에 대한 콜백 JavaScript: Passing parameters to a callback function

에 인수를 전달하는 방법이 될 것입니다 :

function getFooterContent(done, fail){ 
    $.getJSON("scripts/pageData/footer/footerData.json", 
    function(jsonData){ // This function is executed when request is ready and server responds with OK 
    // console.log(jsonData); 
    // return jsonData; 
    done.call(null, jsonData); // or done.apply() 
}). 

fail(function(){ // This when servers responds with error 
    // console.log("fail");  
    // return -1; 
    fail.call(); // or fail.apply() 

}); 
}