使用click事件跨模塊的Javascript調用變量

Question

新手Javscripter在這里。 我正在嘗試對模塊進行一些練習，但遇到了麻煩。 我試圖讓controller模塊以最小的成功從UIControl模塊訪問wagerAmount （由用戶輸入）。 我的相關代碼如下：

var UIControl = (function() {
  return {
    getWager: function() {
      return {
          wagerAmount: document.getElementById('wager').value
      };
    }
  };
})();


var controller = (function(UICont) {
  var topics = ['sports', 'history', 'technology', 'music', 'movies'];
  var wager = UICont.getWager();

  var changeClass = function() {
    document.getElementById('bet').addEventListener('click', function() {
      console.log(wager);
      for (var i = 0; i < topics.length; i++) {
        if (document.getElementById(topics[i]).classList[1] == 'select') {
                activateAnswers();
            }
        }
    });
  }
})(UIControl);

運行此命令時， console.log(wager) {wagerAmount: ""} console.log(wager)打印一個空字符串{wagerAmount: ""} 。 如果我在changeClass函數中聲明wager ， changeClass發生相同的情況。 但是，如果我在click事件中聲明wager ，它將打印用戶輸入的數字。 但是，單擊事件可以很好地訪問controller聲明的topics變量。 這里的主要問題是，當我需要將功能添加到多個click事件中時，我將不得不在每個click事件中聲明一個新變量以訪問相同的函數，這聽起來像是不好的做法。 那么這是怎么回事？

Answer 1

好的，所以在昨晚花了幾個小時試圖解決這個問題之后，今天早上我在喝咖啡后很快想出了解決方案。 萬一其他人遇到此問題，我將發布我的解決方案，如果其他人提出其他建議，他們也可以發布。

而不是聲明的wager在controller的任何地方，我創建了一個內部的新功能controller ：

var retrieveWager = function() {
    return {
        wager: UICont.getWager().wagerAmount
    };
}

然后可以在以下任何點擊事件中訪問它：

retrieveWager().wager;