揭示模块模式内部外部变量不匹配

【问题标题】：revealing module pattern inner outer variable mismatch揭示模块模式内部外部变量不匹配
【发布时间】：2016-10-27 05:23:24
【问题描述】：

<html><body><button>setSpeed</button>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script>

$(document).ready(function(){
  $('button').on('click', function(){
    _.setSpeed();
    console.log('_.slow: ' + _.slow);
  });
});

var _ = (function(){
  var slow = 4;
  
  function setSpeed(){ 
    if (slow == 4) {
      slow = 1;
    } else if (slow == 1){
      slow = 16;
    } else {
      slow = 4;
    }
    console.log('slow: '+ slow);
  }
  return { slow: slow, setSpeed: setSpeed };

})();

</script></body></html>

我不明白为什么 console.log for slow 和 _.slow 不匹配？我错过了什么？

通过在 IIEF 中返回 var slow 和 setSpeed 函数，我认为它们应该匹配。

【问题讨论】：

标签： javascript revealing-module-pattern

【解决方案1】：

当你这样做时：

return { slow: slow, setSpeed: setSpeed };

您正在创建一个具有两个属性的新对象，slow 和 setSpeed。 slow 的值是从var slow 分配的。由于这是一个原始类型（不是参考值），因此您将获得当前值的副本 slow (4)。

当您调用 setSpeed 时，它会修改 var slow 将其更改为 1。这不会影响 _.slow（因为它不是参考）。

【讨论】：

如果你想在你的 IIEF 中检查 slow 的值，你可以尝试添加一个 getter 函数。 function getSlow(){ return slow; } 在您的 return 部分 return { getSlow: getSlow, setSpeed: setSpeed }; 中，或者您可以为您的 slow 属性绑定一个 getter 函数。 (developer.mozilla.org/en/docs/Web/JavaScript/Reference/…)