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

Question

<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，我认为它们应该匹配。

Answer 1

当你这样做时：

return { slow: slow, setSpeed: setSpeed };

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

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

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

revealing module pattern inner outer variable mismatch

javascript

revealing-module-pattern