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
})();