JavaScript的执行顺序

我无法理解以下的执行顺序。这是一个较大脚本的一部分，但是

$（“#选择覆盖”）

开始了这一过程

function findSelectedMap(mapID) {
    $.getJSON('maps.json', function (json) {
        json.forEach(function (entry) {
            if (entry.maps.id == mapID) {
                changeLayerTo = entry.maps.url;
                maxZoom = entry.maps.zoom;
            }  // end if
        }); // end json.forEach
    });    // end $.getJSON
}       // end findSelectedMap

function overlaySelector() {
    $("#select-overlay").change(function () {
        mapID = $("#select-overlay input[type='radio']:checked").val();
        findSelectedMap(mapID); // using mapID, find the url, zoom for overlayMap selected
        currentLayer = L.tileLayer(changeLayerTo).addTo(map);
        // more map stuff
    }); // end $( "#select-overlay" ).  
} // end overlaySelector function

---

当页面加载到Rails应用程序中时，将调用

OverlySelector

<script>
  $(document).on("turbolinks:load", function() 
  {
     overlaySelector();
  });
</script>

$（文档）.on（“TurboLink:load”，函数（）
{
覆盖选择器（）；
});

我认为

changeLayerTo

应该在

currentLayer=L.tillelayer（changeLayerTo.addTo（map）之前的第5行上设置被执行。进入
findSelectedMap（mapID）
函数（我有一堆console.log要跟踪），然后执行跳转到
currentLayer=L.tileLayer（changeLayerTo）.addTo（map）行（和错误，但我在上面手动定义了
changeLayerTo
，这样执行就可以继续，然后
json.forEach（函数（条目）
行执行并迭代
maps.json
中的十几个条目，并找到正确的值。当然，我需要更快地得到该值

我缺少什么？最初是
查找选定地图（mapID）
嵌入了
OverlySelector
函数中，但我把它拔了出来，看看它是否有帮助，它看起来像是更干净的编码。所有变量都是在函数之外声明的。我不认为我正在以最佳方式解决问题，但我需要url和缩放（最终还有一些与地图相关的其他数据）.
尝试以下操作：

function findSelectedMap(mapID, cb) {
    $.getJSON('maps.json', function (json) {
        json.forEach(function (entry) {
            if (entry.maps.id == mapID) {
                changeLayerTo = entry.maps.url;
                maxZoom = entry.maps.zoom;
            }  // end if
        }); // end json.forEach

        cb();
    });    // end $.getJSON
}       // end findSelectedMap

function overlaySelector() {
    $("#select-overlay").change(function () {
        mapID = $("#select-overlay input[type='radio']:checked").val();
        findSelectedMap(mapID, function() {
            currentLayer = L.tileLayer(changeLayerTo).addTo(map);
        }); // using mapID, find the url, zoom for overlayMap selected            
        // more map stuff
    }); // end $( "#select-overlay" ).  
} // end overlaySelector function

基本上，cb参数是一个回调函数，将在forEach循环结束后立即执行，然后此行
currentLayer=L.tileLayer（changeLayerTo）.addTo（map）；
将使用正确的
changeLayerTo

更新-正如@Adriani6所建议的：您应该通过回调将变量传回，而不是将它们全局分配给窗口对象，当然，如果它们不需要是全局的
，您可能会调用
OverlySelector（）
before，它包含一个
change
事件。因此，当然，一旦
上的
change
事件被触发并被截获，代码将在分配
changeLayerTo
之前执行。
$。getJSON
也是异步的，最好记住这一点。函数在被调用之前不会启动异步调用是您的问题。在执行
$.getJSON
时，您将立即分配currentLayer。
OverlySelector（）
在页面第一次加载时被调用。@Eleazar Enrique。我看到了下面的修复方法。我会尝试一下。我想我理解异步部分，但不理解解决方法。但我会尝试一下。我可以用包装$.getJSON的东西告诉它等待吗？这对我来说似乎更直接。我是一个JavaScript新手。@Adriani6:I无法运行
overlyselector（）
之后，因为我在那里选择了选项。但可能我没有理解你的意思。我尝试了建议后会回来。我在帖子中删除了很多脚本，所以希望慢慢来。谢谢大家。如果是这样的话，你应该通过回调将变量传回，而不是全局分配给窗口对象，当然，如果它们不需要是全局的。但这是一个小建议。@Adriani6您是对的，但是，我没有关于代码流的更多信息。正确，这就是为什么它是一个小建议，这意味着我将把它作为答案的一部分（显然是对OP的建议）。