什么是MVVM,我们应该使用它吗？

Question

我一直在关注MVVM模式,特别是knockoutjs,而且大多只是让我感到畏缩.对于保持结构,演示和显示分开的好处,我不会长时间咆哮,我只想问(作为一个例子):有什么区别

<button data-bind="click: someJavaScriptFunction">Something</button>

和

<button onclick="someJavaScriptFunction();">Something</button>

我们应该在标记中加入如此多的行为控制吗？尽管这很简洁,但它似乎违背了我所听过的每一个网络编程原则.

我错了吗？

Answer 1

这是对您的问题的更直接的答案.

在第二个示例中,您指的是必须位于全局范围内的函数(即window对象的属性).

在第一个示例中,您指的是当前视图模型的属性.

是的,这是一个微妙的区别,但它是一个重要的区别.如果使用事件属性,则只能引用全局范围中存在的事物.这意味着您必须在全局范围内放置要访问的所有内容,这会导致代码非常混乱.

如果使用声明性绑定,则绑定的确切含义取决于上下文.

它有助于将HTML标记视为更加巧合.您真正关注的是对视图模型的结构化访问.想想with和forEach嵌套的上下文和其他绑定他们的属性.声明性绑定和底层HTML之间的关系突然感觉更像是使用XSLT.

这两个例子看起来非常相似.但是潜在的概念是截然不同的,它们使数据绑定如此强大,而且事件属性如此令人讨厌.

事件属性不赞成的原因不仅仅是它们将逻辑与结构混合在一起.这是他们将任意JavaScript代码绑定到HTML元素的弱尝试,这阻止了应用程序逻辑的正确封装.事件属性是低级"钩子",绑定扩展了元素的行为.

尽管如此,通过使用声明性绑定,很可能会做人们对事件属性所做的同样可怕的事情.不同之处在于你可以用它们做些什么.你不应该总是通过如何滥用技术来判断技术 - 我们都是成年人.

Answer 2

您只使用MVVM的一部分 - 特别是View - 在上面给出的代码示例中.使用Knockout(或任何其他MVVM库)的原因是可以轻松地将视图绑定到模型 - 视图模型 - 从而允许您停止编写大量样板代码,只是为了从视图中返回值.

我看到很多不稳定的javascript/jquery代码,人们去使用这样的东西:

var ex = {
   some1: $('#textbox1').val(),
   some2: $('#textbox2').val()
};

这样做的问题在于它在整个Web应用程序中乱七八糟,维护变得非常繁琐.我知道Knockout,每当我的View更新时,我的View Model也会更新.

每个应用程序都不需要它,你不应该只使用它,因为它使用起来很"酷".显然需要有理由使用它,我上面的例子是一个原因,我确信还有更多.