javascript數組引用和回調函數

Question

我不了解的內容我想解釋很久了，所以請多多包涵。 我的頁面中包含以下incude js：

var include = (function(){
    var exports = {}
    var test = function(url){
        var result = [];
        $.ajax(url).then(function(data){
            result = data.form.records;  // assume data.form.records valid
            console.log(result) // displays correctly Array [Object,Object] 
        });
        return result;
    }
    exports.test = test;
    return exports
})();

然后從頁面中進行以下調用（假設some_url有效）

var array = include.test(some_url);

稍后我有一個事件（單擊某些按鈕）將使用數組中的值

input.on('click',function(){
   console.log(array) // 2
});

我的問題是，當事件發生時，數組變量仍然是VOID，console.log // 2顯示Array [] ....

我知道我的測試函數會立即返回，因此數組變量的立即值是Array []，但是到input.click被調用時，then（）回調將已經執行，因此應該修改數組本身。數組是一個參考...

有什么建議嗎？ 我通常不問問題，因為大多數時候我都是通過搜索找到答案的，但是我已經嘗試了一天。 也許我缺乏靈感。 一些幫助將不勝感激

Answer 1

array指向一個空數組，但是在ajax回調中，您有result = data.form.records; 這將為result分配一個新數組， result不是更新由array引用的array ，這就是為什么即使在控制台記錄了result數組的正確值后，它仍指向初始空數組的原因。

var include = (function() {
  var exports = {}
  var test = function(url) {
    var result = [];
    $.ajax(url).then(function(data) {
      result.length = 0;//remove existing items from the array
      result.push.apply(result, data.form.records);//copy the items from the records to the result array instead of assigning a new value
      console.log(result) // displays correctly Array [Object,Object] 
    });
    return result;
  }
  exports.test = test;
  return exports
})();