JS变量与函数作用域问题：init函数未更新外层变量原因及修复

问题原因 #

这是典型的**变量遮蔽（Variable Shadowing）**问题：

• init函数的形参a、b和外层闭包作用域声明的var a、var b完全同名
• 在init函数作用域内访问a、b时，会优先指向当前函数的形参，而非外层闭包的变量
• 代码中a = a、b = b实际是将形参的值赋值给形参本身，没有对闭包外层的a、b产生任何修改，因此sum函数读取的始终是初始值0+0，输出结果为0

修复方案 #

不修改init参数名的前提下，我们可以把外层需要共享的变量挂载到一个专属的状态对象上，避开变量命名冲突即可，修复后代码如下：

var module = (function sumModule(){
  // 将公共变量放到专属state对象下，避免和形参同名冲突
  const state = {
    a: 0,
    b: 0
  };
  
  const init = (a,b) =>{
    // 明确赋值给state对象下的属性，不会和形参混淆
    state.a = a;
    state.b = b;
  }
  
  function sum() {
    return state.a + state.b;
  }
  
  return {
    sum: sum,
    init
  }
  
})();

module.init(1,2);
console.log(module.sum()) // 输出结果为3，符合预期

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