1

我有一个 GUI 的一部分的类。它是一个拨动开关，具有switch公共成员功能，可将 GUI 开关置于您想要的任何位置。当您单击 GUI 元素时，我希望onToggle在 GUI 调用该switch函数时触发一个事件。

这是我的选择（我正在考虑并希望得到您的建议）来实现这一点：

1）创建一个setOnclick公共成员函数，我的控制器可以使用它来将事件的触发分配给元素并处理switch函数调用。

toggleInstance.setOnclick(function() {
    onToggle.fire();
    toggleInstance.switch();
})

2）我可以将事件触发和switch函数调用放在类本身中

element.onclick = function() {
    onToggle.fire();
    public.switch();
}

我认为让 GUI 类（例如我的拨动开关）完全没有任何逻辑或功能会很好，但我不确定这是否有必要。

我没有使用 MVC 框架，但我喜欢应用在 MV 和 C 之间分离功能的原则。

您能想到未来这两种方法的任何潜在缺点吗？

4

1 回答 1

2

HTML/CSS/JavaScript：

在客户端代码中，您拥有表示内容的 HTML、定义该内容的呈现方式的 CSS 以及用于确定和分配内容和呈现元素的行为的 JavaScript。

简而言之，您在这里有正确的想法。仅仅通过将 JavaScript 排除在 HTML 之外，将 HTML 排除在 JavaScript 之外，您就已经在正确规划架构方面做了很多工作。

在 JavaScript 中，您可以遵循 MVC，但在大多数情况下，只要您记住 HTML 是内容，JavaScript 是行为，CSS 是表示，那么您已经做了很多工作来使您的代码具有高度可维护性。

话虽如此，让我们专注于您的 JavaScript。

MVC：

虽然我认为您确实有正确的想法，但您的第一个示例函数的命名可能并不完全正确。当我想到“setOnclick”时，我认为您正在设置 onclick 事件，而不是触发 onclick 事件。

因此，我描绘了这个：

// reuse this same function to bind that same event to other similar buttons
toggleInstance.setOnclick(function(element) {

    element.onclick = function() {
        onToggle.fire();
        public.switch();
    }
});

如果您需要多个控件来重复该事件，您只需传入该元素并将相同的单击处理程序绑定到它即可。

您可以通过在单独的函数中定义实际的事件处理程序来更进一步

// event handler is now named, so it can be easily reused
toggleSwitch: function() {
    onToggle.fire();
    public.switch();
}

toggleInstance.setOnclick(function(element) {

    // bind the event to the element passed in
    element.onclick = toggleInstance.toggleSwitch;
});

我唯一的建议是小心不要过度架构。MVC 是一种平衡，过度架构的东西可能与粗心的架构不足的东西一样笨拙和难以使用。

考虑这些细节很好；如果您知道需要重用哪些事件并专注于这些事件，他们将以较低的技术债务形式支付红利。

于 2012-05-19T02:21:43.640 回答