Javascript 试图通过显示模块模式来改进JS技术-简单示例

与最近的其他人一样，我正试图根据我对JS的阅读，从一种更基本的声明式JS风格过渡到一种更模块化的风格

虽然我大致掌握了模块模式的概念，但我不太确定我是否正确地应用了这些技术。很明显，我知道有很多方法可以剥猫皮和猫皮。我只是想从一个对我有意义的地方开始

例如，给定以下HTML和JS，下面的代码假设jQuery已加载。然而，对我来说，它仍然觉得在实现上有些不太正确

HTML

---

在domready之前执行了一些函数，$，可能不必要地公开了init方法，但模块模式没有什么特别的错误。到底是什么感觉不太正确？首先，我认为使用名为d和h的变量没有任何意义，如果您想使代码更小，请在部署之前将其缩小。当然，这与您使用显示模块模式无关。这是一个简化的示例。在现实世界中，我可能会多次使用d和h，因此在一开始分配它们时更有意义。只需将myMod.init放入$document.ready中即可。。。会修复domready吗？是的，这足以迫使它在domready上执行。我的评论更多地指向所用变量的名称，而不是创建该变量的事实。@skube:Nope，因为d和h在init之前被分配到外部。您还必须将jQuery选择移动到init内部。

<div id="someDiv">
  <h2>Header</h2>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
</div>

// Using Revealing Module Pattern:
// - add attribute to div
// - add click event to h2 which toggles p
var myMod = (function () {

    // defined & cached within the local scope
    var d = $('#someDiv'),
      h = $('h2'),
      addAttribute = function () {
        d.attr("data-info", "something here");
        addClickEvent();
      },
      addClickEvent = function () {
        h.click(function () {
            toggleP(this);
        });
      },
      toggleP = function (el) {
        $(el).siblings().toggle();
      };


    // Return public object 
    return {
      init: addAttribute
    };

})();

myMod.init();