在回调中保持变量范围答案

【问题标题】：Perserving variable scope in callback在回调中保持变量范围
【发布时间】：2015-12-18 07:50:19
【问题描述】：

鉴于以下脚本，我预计第一次打开对话框时，var2 将在 open 回调之后立即未定义，但第二次将设置为 123。并非如此，它总是不明确的。为什么？

然后我取消注释var2=111; 没有变化？？？ JavaScript 不是线性执行的吗？显然不完全，因为它以某种方式“知道”var2 将在此回调中本地定义。我的解释正确吗？

然后我将var var2 = 123; 更改为var2 = 123;，一切正常。

var var1=321;
// var2=111;
var dialog = $('#dialog').dialog({
    autoOpen: false,
    open: function (event, ui) {
        console.log(var1, var2);
        var var2 = 123;
    },
});
$('#open').click(function () {
    dialog.dialog('open');
});

<div id="dialog"></div>
<button id="open">Open</button>

【问题讨论】：

variable hoisting

标签： javascript variables callback namespaces closures

【解决方案1】：

您的小提琴中的代码几乎等于下面的代码：

var var1=321;
var dialog = $('#dialog').dialog({
    autoOpen: false,
    open: function (event, ui) {
        var var2; // variable-hoisting
        console.log(var1, var2);
        var2 = 123; //gets initialized only here
    },
});
$('#open').click(function () {
    dialog.dialog('open');
});

如您所见，变量var2 被提升到函数体的顶部，从技术上讲，undefined 在您记录它的下一行中。您在登录后为其分配一个值。尝试在记录之前分配它时查看它会记录什么。你会得到正确的值。

而且由于您是在 open 函数中声明变量，因此该变量不会持续存在，而是会被重新声明，每次执行时都会为您提供相同的结果。

【讨论】：