Возврат значений из модулей Javascript после вызова ajax

---ОТРЕДАКТИРОВАНО --- из-за моего невежества, это на самом деле то же самое, что и все остальные вопросы типа AJAX... нужно правильно мыслить. Оставлю это здесь для потомков и, возможно, помогу другим еще раз взглянуть на обратные вызовы перед публикацией.

Итак, я хотел бы сказать заранее, что я думаю, что это не стандартная проблема «как мне вернуть значение из вызова ajax», когда люди не ждут завершения асинхронного вызова. Я думаю, что это неправильное понимание области переменных с шаблонами модулей Javascript, поэтому любые рекомендации будут оценены.

Я следую этому сообщению SO о создании моего ajax вызов, поэтому я использую отложенные объекты для обработки данных после завершения вызова. А также несколько руководств по шаблону модуля Javascript, например это и < href="http://javascriptplayground.com/blog/2012/04/javascript-module-pattern/" rel="nofollow noreferrer">это. Кажется довольно простым возвращать значения из частного модуля внутри моего внешнего модуля, однако я всегда получаю myObj.roots() как неопределенное. Несмотря на то, что он определяется как массив значений X, когда я проверяю точки останова. Какую простую вещь мне не хватает - какие-нибудь намеки? Спасибо! Извините за простой вопрос, я совершенно новичок в шаблонах модулей JS и пытаюсь создать свою собственную библиотеку...

Мой JS-код:

var myObj = (function(window,document,$,undefined){

  var _baseUri = 'http://example.com/',
      _serviceUri = 'services/',
      _bankId = '1234',
      _myUri = _baseUri + _serviceUri + 'objectivebanks/' + _bankId,
      _roots = [];

  function myAjax(requestURL) {
    return $.ajax({
      type: 'GET',
      url: requestURL,
      dataType: 'json',
      async: true
    });
  }

  var getRoots = function() {
    var _url = _myUri + '/objectives/roots';
    _roots = [];
    myAjax(_url).done(function(data) {
      $.each(data, function(index, nugget) {
        _roots.push(nugget);
      });
      return _roots;
    }).fail(function(xhr, textStatus, thrownError) {
      console.log(thrownError.message);
    });
  }

  return {
    roots: getRoots
  };
})(this,document,jQuery);

Моя ошибка (из консоли инструментов разработчика Chrome):

myObj.roots()
undefined

javascript ajax module-pattern revealing-module-pattern
person user    schedule 22.08.2013    source источник

Ответы (1)


arrow_upward
4
arrow_downward

Ваша функция "getRoots" ничего не возвращает. Использование шаблона $.ajax(successCallback) или $.ajax.done() — это одно и то же. Вы ничего не откладываете. Вы не можете сделать это без обратных вызовов, событий или обещаний. Обратные вызовы и события в основном одинаковы, только последние допускают лучшую архитектурную развязку (крайне спорный факт). Промисы означают, что вы можете написать var x = getRoots() и x будет неопределенным, пока браузер не получит ответ от сервера. Ваше приложение должно учитывать это. Таким образом, либо вы начинаете программировать с учетом асинхронного шаблона (обратные вызовы, события), либо разрабатываете приложения, которые изящно обрабатывают нулевые/неопределенные значения.

Использование обратных вызовов:

function getStuff(callback) {
    $.ajax(...).done(function(data) {
        // maybe process data?
        callback(data);
    });
}

getStuff(function(data) {
    // this is where I can use data
});

Таким образом, вы можете написать свои методы getStuff в отдельном модуле, скажем, «DataService», чтобы логика MVC не загрязнялась.

person Sergiu Paraschiv    schedule 22.08.2013
comment
Хорошо спасибо! Я, очевидно, все еще полностью сбит с толку обратными вызовами и тем, как их использовать в модулях... Я подумаю об этом/попробую еще... Спасибо! - person user; 23.08.2013