Не может добавить объект Выстроить в getJSON функции данных jQuery (проблема объема)

Question

Не может добавить объект Выстроить в getJSON функции данных jQuery (проблема объема)

Я сделал, чтобы человек возразил, и хочет сохранить его в глобальный ArrayCollection, который я сделал. Работает отлично в нормальном объеме:

var s = new ArrayCollection();
s.add(new person("Knud", "Mikkelsen", 35));

Проблема состоит в том, когда я хочу добавить людей в своей функции jQuery "mainFunction".

Я, может казаться, не разбираюсь в нем. Я знаю, что это - что-то, чтобы сделать с объемом, и я должен перенести что-то в функции как в моем ArrayCollection. Помогите мне - большое спасибо.

function ArrayCollection() {
 var myArray = new Array;
 return {
  empty: function () {
   myArray.splice(0, myArray.length);
  },
  add: function (myElement) {
   myArray.push(myElement);
  },
  getAll: function () {
   return myArray;
  }
 }
}

function person(firstName, lastName, age) {
 this.firstName = firstName;
 this.lastName = lastName;
 this.age = parseInt(parseFloat(age));
}

function mainFunction() {
 //....
 var s = new ArrayCollection();
 s.add(new person("Knud", "Mikkelsen", 35));

 $.getJSON(url, function (data) {
  for (var x = 0; x < data.length; x++) {

   var myPerson = new person(data[x].FirstName.toString(), data[x].LastName.toString(), data[x].Age.toString());
   s.add(myPerson);
  }
 });

 alert(drawArray(s.getAll()));
}

function drawArray(myArray) {
 var v = "";
 for (var i = 0; i < myArray.length; i++) {
  v += myArray[i].firstName + " " + myArray[i].lastName + " (" + myArray[i].age + ")\n";
 }
 return v;
}

1

javascript jquery scope

задан mch_dk 6 May 2010 в 08:19

1 ответ

Другие вопросы по тегам:

javascript jquery scope

Похожие вопросы:

score 2 · Accepted Answer

Я не вижу здесь проблемы с областью применения. Ваша функция успеха для getJSON определена внутри mainFunction и поэтому имеет доступ к s. mainFunction определена как аналог person и поэтому имеет к нему доступ.

Я вижу проблему синхронности/асинхронности. Вот порядок выполнения mainFunction:

Создать новую ArrayCollection.
Добавьте в нее человека по имени Knud Mikkelsen
Инициируйте запрос данных через $.getJSON.
Оповещение, показывающее одного человека в ArrayCollection (Knud Mikkelsen)
Возврат
В какой-то момент в будущем вызов getJSON завершается и добавляет объекты персон в ArrayCollection

Это происходит потому, что по умолчанию, getJSON является асинхронным - он завершается в какой-то момент в будущем, а не синхронно с кодом, в котором он был инициирован. Это хорошо, потому что синхронные вызовы Ajax полностью блокируют пользовательский интерфейс браузера и создают плохой пользовательский опыт.

Для того чтобы действительно увидеть человека, возвращенного вызовом Ajax, можно переместить оповещение в обработчик успеха getJSON, и/или передать обратный вызов в mainFunction, который будет вызван функцией завершения getJSON, и/или передать ArrayCollection для добавления в mainFunction и просто проверить его на наличие новых объектов персон позже как часть потока вашей программы.

Вот несколько вариантов:

Просто переместите alert внутрь функции завершения getJSON:

function mainFunction() {
    //....
    var s = new ArrayCollection();
    s.add(new person("Knud", "Mikkelsen", 35));

    $.getJSON(url, function (data) {
        for (var x = 0; x < data.length; x++) {
            var myPerson = new person(data[x].FirstName.toString(), data[x].LastName.toString(), data[x].Age.toString());
            s.add(myPerson);
        }
        alert(drawArray(s.getAll())); // <== moved this into the completion function
    });
}

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

function mainFunction(callback) {
    //....
    var s = new ArrayCollection();
    s.add(new person("Knud", "Mikkelsen", 35));

    $.getJSON(url, function (data) {
        for (var x = 0; x < data.length; x++) {
            var myPerson = new person(data[x].FirstName.toString(), data[x].LastName.toString(), data[x].Age.toString());
            s.add(myPerson);
        }
        callback(s);                // <== Trigger callback, passing in the collection
    });
}

function mainFunctionCallback(s) {
    alert(drawArray(s.getAll()));   // <== Moved out of `mainFunction` entirely
}

// Usage:
mainFunction(mainFunctionCallback);