Возврат данных из отложенного вызова ajax

Question

Я пытаюсь вернуть данные из асинхронного вызова, но ничего не получаю.

код ниже которого прокомментирован объяснить далее:

function displayBox() { 
    var data = JSON.parse(getApiLocalStorage('getApi')); // 1. get the data 
    console.log('data is '+data); // <-- never gets called 
} 

function getApiLocalStorage(cookieName, url) { 
    var cookieName = cookieName || 'getApi', 
    cookieUrl = url || 'https://s.apiUrl.com/75/f.json', 
    store = null; 
    if (store === null) { // if null, go get the data 
    $.when(getApi(cookieName, cookieUrl)).then(// 2. it's not there so wait for the data to come through 
     function(data) { 
      console.log(data); // <-- when data comes back, this is ok 
      return data; // <-- this seems to do nothing 
     } 
    ); 
    } 
} 

function getApi(cookieName, url, callback) { 
    var deferred = $.Deferred(); 
    $.ajax({ 
    url: url, 
    type: 'get', 
    dataType: 'json', 
    async: true, 
    success: function(jsonData) { 
     var data = JSON.stringify(jsonData); 
     deferred.resolve(data); 
    } 
    }); 
    return deferred.promise(); 
} 

displayBox(); // start the process 

Вопрос, когда displayBox() называется, почему данные не возвращаются из $.when(getApi(cookieName, cookieUrl))?

Answer 1

getApiLocalStorage не имеет инструкции return, поэтому он всегда будет возвращать undefined. Передача этого значения в JSON.parse() вызовет исключение. Это прерывает функцию до того, как она достигнет линии console.log.

Обещания облегчают передачу обратных вызовов асинхронным функциям.

Обещания позволяют передавать обратные вызовы асинхронным функциям после вызова асинхронной функции.

Обещания не делают синхронные асинхронные функции. Они не позволяют вам вернуть окончательный результат, прежде чем вы захватили этот результат.