Использование объектов для правильной замены глобальных переменных

Question

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

function XML_Data() {
  this.data = null;
}

XML_Data.prototype = {
 GetXML: function() {
  $.ajax({
   type: "GET",
   url: "questions.xml",
   dataType: "xml",
   success: function(xml) {
    this.data=xml;
   } //close success
  });//close AJAX  
 },

 UseXML: function() {
  alert(this.data)
 }
};

(Моя реализация скрипта)

---

Однако я столкнулся с проблемой.Когда я запускаю функции, показанные здесь, используя этот бит кода:

var data = new XML_Data();
data.GetXML();
data.UseXML();

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

Спасибо, Эллиот Бонневиль.

Answer 1

Просто к сведению

var data = new XML_Data();
data.GetXML();  //This will run the ajax request
data.UseXML();  //This will most likely run before the ajax request is finished.

Публикация событий в Jquery, вероятно, сработает, но я не проверял этот код.

function XML_Data() {
  this.data = null;
}

XML_Data.prototype = {
 GetXML: function() {
  $.ajax({
   type: "GET",
      url: "questions.xml",
   dataType: "html",
   success: function(xml) {
    this.data=xml;
    $(window).trigger("myAjaxEvent");
   } //close success
  });//close AJAX  
 },

 UseXML: function() {
  alert(this.data)
 }
};


$(document).ready( function () {
    var data = new XML_Data();
    $(window).bind("myAjaxEvent", function () {
      data.UseXML();
    });

    data.GetXML();

});

Answer 2

Код, который вы сейчас имеете, пытается работать синхронно (по порядку) с использованием неблокирующего асинхронного API. Вызов UseXML происходит до того, как вызов GetXML фактически завершает свою работу с AJAX, потому что он асинхронный.

Вы можете написать это в асинхронном шаблоне (в котором this.UseXML вызывается непосредственно при успешном выполнении запроса AJAX), или в синхронном шаблоне (в котором «async: false» передается вызову AJAX). Асинхронный шаблон гораздо более распространен в разработке на JavaScript, так как он намного более мощный, и синхронные запросы блокируют пользовательский интерфейс в браузере, предотвращая выполнение сценариев, но синхронно намного проще сделать для небольших вещей.

См. http://api.jquery.com/jQuery.ajax/