使用 Javascript 和 PHP 的设计模式答案

【问题标题】：Design Pattern with Javascript and PHP使用 Javascript 和 PHP 的设计模式
【发布时间】：2011-08-23 15:36:16
【问题描述】：

我正在用 PHP 创建一个网站，其中也包含 Javascript 元素。这个，将有一个插件系统，插件可以动态添加到网站。

我已经创建了插件系统，但我不喜欢设计中的某些元素。特别是，我使用的是 MVC 模式，但是 javascript 抽象存在问题。

我有一个加载所有插件的文件。然后，有一个 javascript 文件可以动态地将框添加到窗口中，具体取决于所做的选择，用于应使用的插件。

在 js 文件中是这样的：

 if (SelValue == 'image_list')
   image_list(form_name, new_div, parent_div);

 if (SelValue == 'multiple_columns')
   multiple_columns(form_name, new_div, parent_div);

然后，就在下面，遵循 imagelist() 的声明，依此类推。当然，这很麻烦，而且看起来肯定不是一个好的做法。我希望将所有这些抽象和隔离，以便插件只是添加到我的代码中的一个简单步骤，如果可能的话。

您知道任何适合这种情况的设计模式或实践吗？

【问题讨论】：

你可能会觉得有用的东西：github.com/janl/mustache.js

标签： php javascript design-patterns

【解决方案1】：

您可以创建一个包含所有函数的对象，例如 image_list 和 multiple_columns。使用这些看起来像：

plugins[SelValue](form_name, new_div, parent_div);

添加新函数如下所示：

plugins.image_list = function (form_name, new_div, parent_div) {
    /* … */
}

这个定义可以放在不同的文件中。你是这个意思吗？

编辑：漂亮的单文件版本：

plugins = {
    image_list: function (form_name, new_div, parent_div) {
        /* … */
    },
    multiple_columns: function (form_name, new_div, parent_div) {
        /* … */
    },
};
plugins[SelValue](form_name, new_div, parent_div);

【讨论】：

嗯，出于性能考虑，我实际上对使用多个 js 文件很犹豫。考虑到这一点，我想让它遵循一种设计模式风格，比如开放/封闭原则或接口编程。我正在考虑接近您的解决方案，但由于这是 js 而不是 c++，因此多个文件可能是个问题。
好吧，您不必将它放在不同的文件中。只需使用哈希/对象来干掉 if / 开关。
它肯定是比我现在拥有的更漂亮的版本。好吧，看来javascript和太多的oop无论如何都不符合，所以这确实可能是最可取的解决方案。因为我必须将声明放在一个文件中，所以无论如何它都会有点臃肿：/

【解决方案2】：

如果您的 IF 语句不超过 2 个，那就足够了。但是，如果您要扩展它（或者可以预见它会扩展），那么我建议使用工厂/命令设计模式。实现细节将包括一个表或字典来替换您将拥有的多个 IF 语句。

【讨论】：

是的，实际上已经有 15 个 IF 了；）我现在正在研究这种模式。

【解决方案3】：

模块模式可能非常适合您的需求。这种模式基本上会将每个“插件”视为一个模块，它本身应该是功能齐全且独立的。然后你有一个模块加载器/控制器，它负责加载正确的模块，并使模块能够相互通信。

http://www.adequatelygood.com/2010/3/JavaScript-Module-Pattern-In-Depth

http://www.yuiblog.com/blog/2007/06/12/module-pattern/

【讨论】：

这很有趣，我正在仔细研究thanx