26-数据绑定和jQuery

6.6 数据绑定和jQuery

数据绑定是一种机制，确保当 Model 数据发生变化时，界面会更改，以体现 Model数据的变化。并且反之，当用户更改了界面时，Model数据会相应地更新。如果你曾经实现了UI上的数据绑定，当然早就习以为常了。

在本章，我们使用jQuery的方法来实现数据绑定。当单页应用中的Model数据发生变化时，发布 jQuery 全局自定义事件。jQuery 集合订阅了特定的自定义全局事件，当事件发生时，会调用函数更新它们的展示。当用户在屏幕上修改数据时，会触发事件处理程序，调用更新Model的方法。这很简单，对如何以及何时更新数据和展示，提供了很大的灵活性。使用 jQuery 的数据绑定不难，它也不是什么神秘的魔法（再说魔法是一种好东西啊）。

警惕单页应用“框架”库随身携带的礼物

一些单页应用“框架”库承诺“自动的双向数据绑定”，这听起来很不错。但先不管那些令人印象深刻的千篇一律的演示（demo），我们已经学到了对于这种承诺的几个要警惕的点。

我们需要学习库语言——它的API和术语，以便做到西装革履的演讲者可以做到的事情。这是一项重大的投资。

库的作者经常有一个愿景，单页应用该如何如何组织。如果我们的单页应用不符合这个愿景，修改的代价是很昂贵的。

库很庞大，bug满天飞，会增加另外一层复杂度，会把事情搞砸。

库的数据绑定功能可能经常不能满足我们的单页应用的需求。

我们把注意力放到最后一点上。可能我们想让用户能够在表格中对行进行编辑，当完成编辑的时候，要么接受整行的更改，要么取消更改（在这种情况下，要把行恢复到旧的值）。并且，当用户正在编辑行的时候，我们想让用户接受或者取消整个编辑过的表格。只有到这个时候，我们才会考虑把表格保存到后端。

对这种合理交互提供现成支持的框架库很少见。所以如果使用了库，我们需要创建自定义的重载方法，避开默认行为。如果我们使用了库提供的默认行为，不用多久，就很容易出现这样的局面：越来越多的代码、越来越多的层级、越来越多的文件，应用也变得越来越复杂，还不如一开始就自己编写这麻烦的东西。

在经过几次刻意的尝试之后，我们学会了对框架库要抱有警惕的态度。我们已经发现它们会增加单页应用的复杂度，而不是更好、更快地进行开发，或者是更容易让人理解。这并不意味着永远不要使用框架库，它们自有用武之地。但是对于我们的示例单页应用（以及很多产品），只使用jQuery、一些插件和少数专门的工具（比如TaffyDB）就能很好地完成工作了。通常情况下，越简单就越好。

现在我们来添加Data模块并进行一些微调，从而结束单页应用的客户端部分。