JavaScript構建JSON異步和動態

Question

我在異步JavaScript中遇到了一些麻煩。我在jQuery AJAX調用中調用一個函數，並且在這個函數中可能還有其他異步方法調用。我暫時呆在那裏。

這裏我有被jQuery AJAX函數調用的代碼片段：在這裏，我動態構建一個JSON對象。

function getJSONObjektList() { 
    //MainJSON 
    var jsonObjekt = {}; 
    jsonObjekt.ObjektId = []; 
    jsonObjekt.Selected = []; 

    doc = XYZ.GetCurrentDocument(); 
    //probably also an asynchrounous call 
    doc.GetAllObjects(function (objects) { 
     for (var i = 0; i < objects.length; i++) { 
      var obj = objects[i]; 
      var id = obj.id; 
      var caption = obj.caption; 
      var type = obj.type; 
      var my = obj.my; 
      console.log("[obj:" + obj + " id:" + id + " caption:" + caption + " type:" + type + " my: " + my + "]"); 

      //liste alle verfuegbaren Objekte auf 
      jsonObjekt.ObjektId.push(id); 

      if (type === "Statusbox") { 
       doc.GetObject(id, function() { 
        var statusboxInhalt = this.Data.Rows; 
        //inner JSON object       
        var utilJSONObjekt; 

        for (var j = 0; j < statusboxInhalt.length; j++) { 
         // make sure to re-initialize so we don't update the same reference 
         utilJSONObjekt = {}; 
         utilJSONObjekt.SelectedObjektId; 
         utilJSONObjekt.SelectedObjektWerte = []; 

         var inhalt = statusboxInhalt[j]; 
         console.log("Name: " + inhalt[0].text + " Wert: " + inhalt[2].text); 

         utilJSONObjekt.SelectedObjektId = inhalt[0].text; 

         var valAr = inhalt[2].text.split(","); 
         for (var k = 0; k < valAr.length; k++) { 
          utilJSONObjekt.SelectedObjektWerte.push($.trim(valAr[k])); 
         } 
         jsonObjekt.Selected.push(utilJSONObjekt); 
         //**till here is the jsonObject not null or empty, there are some values in there** 
        } 
       }); 
      } 
     } 
    }); 
    //**but on the return statment is the jsonObjekt empty** 
    return jsonObjekt; 
} 

有人提示我該如何解決我的問題，或者如何讓JavaScript最佳地異步工作。

Answer 1

呀，簡單地使用回調格局：

function getJSONObjektList(callback) { // <--- note callback 
    // asynchronous code starts here... 
       for (var k = 0; k < valAr.length; k++) { 
        utilJSONObjekt.SelectedObjektWerte.push($.trim(valAr[k])); 
       } 
       jsonObjekt.Selected.push(utilJSONObjekt); 
       callback(jsonObjekt); 
    // ...and ends here 
} 

，並在你的代碼，你可以使用它像：

getJSONObjektList(function(jsonObjekt) { 
    console.log(jsonObjekt); 
    // other code 
}); 

編輯這裏有兩種解決同樣的問題的一個例子。一個與回調模式和一種無它：

沒有回調

var add = function(x,y) { 
    return x+y; 
}; 
var x = 1; 
var sum = add(x, 1); 
var sum2 = add(sum, 1); 
console.log(sum2); 

回調

var add = function(x,y,callback) { 
    callback(x+y); 
} 
var x = 1; 
add(x, 1, function(sum) { 
    add(sum, 1, function(sum2) { 
     console.log(sum2); 
    }); 
}); 

顯然回調格局較爲凌亂，但如果你正在處理異步操作那麼你絕對需要它，例如：

var add = function(x, y, callback) { 
    // add numbers after 2 seconds 
    setTimeout(function() { 
     callback(x+y); 
    }, 2000); 
} 
add(1, 2, function(sum) { 
    console.log(sum); 
    // will produce 3 after 2 seconds 
    // you can continue your code here 
}); 

這個想法是傳遞一個將在異步操作完成後調用的函數。