JavaScript如何在函数作用域内修改变量并获取最深层级作用域结果

问题原因 #

• visible_scope_2 每层嵌套函数都执行了console.log，所以会输出所有中间修改值，且外层函数未返回最终修改后的变量，调用后无法直接拿到最深层的修改结果。
• visible_scope_3 在每层函数内提前执行了return，return运行后函数会直接终止，后续嵌套函数的定义、调用逻辑完全不会执行，自然无法触发最内层的变量修改。

调整方案 #

按照你期望的和visible_scope_1一致的效果（调用函数直接返回最深层级修改后的变量值），可以参考以下实现：

function getFinalScopeValue() {
    // 外层声明变量，所有内层嵌套函数都可访问修改
    var message = "local scope";
    var a1 = function() {
        var b2 = function () {
            var c3 = function () {
                // 最深层级修改变量
                message = "last scope";
            };
            c3();
        };
        b2();
    };
    a1();
    // 所有嵌套函数执行完成后，返回已被最深层修改的变量
    return message;
}

// 调用即可直接拿到最终结果，和visible_scope_1表现一致
console.log(getFinalScopeValue()) // 输出：last scope

补充说明 #

• JS采用词法作用域规则，内层嵌套函数天然可以访问外层函数作用域中声明的变量，所以最深层c3修改的message就是外层函数声明的同一个变量，嵌套逻辑全部执行完成后直接返回即可。
• 声明变量必须加上var/let/const关键字，否则变量会泄露成为全局变量，引发意料之外的作用域问题。

内容的提问来源于stack exchange，提问作者Schedule