Задержка возврата функции до тех пор, пока запрос Ajax не завершится

Question

Я пишу простую утилиту для обработки многочисленных вызовов JSON, которые я должен выполнить в своем приложении, но проблема с функцией readJson ниже заключается в том, что она завершается перед внутренней функцией, которая получает У данных Ajax есть данные, поэтому он возвращает undefined. Может ли кто-нибудь указать мне на существующий ответ на эту проблему или предложить какие-либо рекомендации о том, как лучше структурировать эту функцию, чтобы она не возвращалась до тех пор, пока запрос Ajax не будет завершен?

json_manager = { 
    thisJson:'', 
    readJson:function(theFileName, thePathName) { 

     var theUrl=(thePathName+theFileName); 
     $.getJSON(theUrl).done(function(theJSON) { 
       json_manager.thisJson=theJSON; 
     }); 
     return(json_manager.thisJson) 
    }, 
     //more functions 
    } 

Answer 1

Вы работаете в классической асинхронной задачи. То, что происходит, - это вызов $.getJSON, не имеющий ничего общего с настройкой вызова на сервер. Он фактически не выполняет вызов, пока текущая исполняющая функция не вернет управление обратно в браузер.

В этой ситуации, вы должны структурировать свой код сказать где данные идут, не спросить для данных.

Что-то вроде этого:

json_manager = { 

    readJson:function(theFileName, thePathName, callback) { 

     var theUrl=(thePathName+theFileName); 
     $.getJSON(theUrl).done(callback); 

    }, 
     //more functions 
} 

Тогда вы можете назвать это нравится:

json_manager.readJson('file', 'path', function(data) { 
    // do something with the returned json 
}); 

Таким образом, вы предоставляете функцию readJson с инструкциями о том, что делать с данными, он получает с сервера.

Answer 2

Единственный путь вы можете сериализовать вещи так, что вызов Ajax завершается до завершения функции, сделав синхронный вызов Ajax. И это НЕ рекомендуется, потому что это часто создает плохой пользовательский интерфейс для конечного пользователя, где браузер заблокирован и не обрабатывает события во время вашего вызова ajax. Не делай так.

Помимо этого, «A» в AJAX означает асинхронность, и вам необходимо научиться программировать в асинхронном режиме, используя обратные вызовы для выполнения работы, требующей результата от вызова AAX. Поскольку Ajax обычно является асинхронным, ваша функция readJson() будет возвращена до того, как будет завершен вызов ajax. Таким образом, вы не можете вернуть результат вызова ajax в этой функции.

Чтобы перестроить код для работы с асинхронным ajax, вы должны перенести всю работу, требующую результата от $.getJSON(), в обратный вызов и вызвать эту функцию обратного вызова с результатом в качестве аргумента из обработчика успеха/завершения ajax вызов.

Вы можете сделать это так:

json_manager = { 
    thisJson:'', 
    readJson:function(theFileName, thePathName, successHandlerFn) { 

     var theUrl=(thePathName+theFileName); 
     $.getJSON(theUrl).done(function(theJSON) { 
       successHandlerFn(theJSON); 
     }); 
    }, 
     //more functions 
}