在JavaScript中结合设计模式是一种好的实践吗

目前我正在做我的私人项目（学习），这是一个简单的任务清单。我正在尝试使用模块模式（具体来说，是显示模块模式）。下图显示了我将如何构建它的总体想法

因此，每个模块将位于一个单独的js文件中，其中每个模块如下所示：

var TaskModule = (function () { 

  function someFunction(parameter) {
    tasks = newTasks;
  }

}

还有一个问题：如果我们想创建类似于单独文件的东西，比如说“helpers函数”，该怎么办。在每个模块中编写以下内容并不舒服：

var someElement = document.getElementById('id')

我有我的助手函数（此函数只是一个示例）：

当然，我可以像其他人一样创建HelpersModule，但是我必须这样调用我的函数：

var someElement = HelpersModule.byId('id');

这导致我的帮助函数不再有意义，它不再比document.getElementById的原始版本短。因此，为了避免每次调用helper函数时都写入前缀“HelpersModule”，我将HelpersModule设计为：

(function(window) {

    window.byId = function (selector, scope) {
      return (scope || document).getElementById(selector);
    };

})(window);

现在一切正常，但我创建HelperModule的方式与其他模块不一致。以不同的方式创建模块是一种不好的做法还是完全可以

创建一个实用模块（如您的

助手模块

）：

const HelpersModule={
byId:id=>document.getElementById（id），
byTag:tag=>Array.from（document.getElementsByTagName（tag））
};

。。。在其他代码的某个地方，将所需的助手函数指定给局部变量：

/。。。
const byId=HelpersModule.byId；//如果你只需要“byId”
常量元素=byId（'my-id'）；
// ...

或者，使用分解：

const{byId}=HelpersModule；//如果你只需要“byId”
常量元素=byId（'my-id'）；

或

const{byId，byTag}=HelpersModule；//如果你两者都需要
常量元素=byId（'my-id'）；
const allspan=byTag（'span'）；

如果两者都有

var someElement = document.getElementById('id')

及

做同样的事情，然后我建议只使用第一个模块，而不是创建一个新模块。这样，您将保持模块模型的真实性，并且每个模块只需添加一行代码。创建一个全新的模块，并且仍然为每个模块编写一行代码是不必要的。这对我理解你的问题有帮助吗

编辑：

我现在明白你的意思了。您想知道是否应该创建一个单独的模块，其中包含每个模块的所有helper方法。在这种情况下，最好将助手方法仅保留在所需的文件中。因此，如果您有一个只在一个文件中使用的helper方法，并且只能用于该文件，那么它应该只保留在该文件中。如果所有方法都在需要它们的文件中，那么跟踪它们就更容易了。它还可以防止您必须在文件之间来回跳转才能找到所需的方法

---

因此，只需将helper方法保留在需要它们的文件（调用它们的文件）中，而不是另一个模块。当您的文件包含数千行代码时，以后会变得混乱。

您的

助手模块.byID（）

是否与

文档.getElementById（）

？@demogorgon.net执行相同的操作？是的，但如果您的模块打算执行不同的操作，这只是一个示例（一个初始化对象，另一个提供全局变量），难怪它们看起来不一样。使用不同的方法完全可以。不过，我建议尽量避免使用全局变量。当然，在本例中，我同意只为一个函数创建另一个模块没有意义。但这只是一个示例。如果我有许多helpers函数，我可能需要这样的模块对于他们。我对我的答案进行了编辑，让我知道这是否有意义。cheers@pastuszkamIn在这种方法中，我可能需要在每个需要这些函数的文件中复制一些函数的代码。我希望避免任何重复。@pastuszkam如果您要在多个文件中复制它，那么是的，将保留一个新的文件来保存它们你的代码是干的（不要重复你自己）这是一个正确的想法，但他没有表示他正在使用ECMAScript 6。@Sahuagin拜托，

const

具有全局支持，我提供了一种解构的替代方案。如果OP确实在

const

方面遇到问题，他可以很容易地用

var

替换它。这就是投票失败的原因吗？是的没问题，答案在ES6中。你的解决方案真的很有用。谢谢。我没有投反对票，没有。也许这没关系，因为他没有指定版本。（我只是觉得看到一个用“经典javascript”编写的问题和一个用“新潮javascript”编写的答案有点刺耳。）

var someElement = document.getElementById('id')

var someElement = HelpersModule.byId('id');