javascript - JavaScript 对象中的范围问题

Question

我正在尝试在 JavaScript 对象中创建一个数组，其中包含使用 jQuery 中的 $.getJSON() 函数从 JSON 文件中提取的对象。我遇到了范围问题，数组元素似乎在 $.getJSON() 函数内部设置，但在其外部数组为空。这是代码:

function player(playlist){
...
var tracks = [];

this.start = function() {
...
    $.getJSON(playlist, function(data){
        $.each(data.tracks, function(key,value){
            var track_info = function(info){return info}(value);
            tracks.push(track_info);
        });
        console.log("from .getJSON function");
        console.log(tracks);
    });
    console.log("outside .getJSON function");
    console.log(tracks);
    ...
};
...
$(document).ready(function(){
    var the_player = new player(playlist);
    the_player.start();
)};

输出为:

outside .getJSON function
[]
from .getJSON function
[Object, Object, Object]

所有对象都包含 JSON 文件中的正确数据。

我对这个问题感到困惑，有人可以帮助我理解它吗？

Answer 1

提示是顺序:

outside .getJSON function
[]

随后

from .getJSON function
[Object, Object, Object]

在获得 JSON 响应之前，您的外部代码正在执行，因此毫不奇怪，tracks 为空。这可能看起来违反直觉 - from .getJSON function 首先出现在源代码中，但第二次执行!这是因为 .getJSON 不是同步的。在继续下一条语句之前，它不会执行其回调参数。它立即继续下一条语句，并稍后执行回调。