knockoutjs怎样工作并且它能给我们带来什么好处？

介绍

Knockout是一个以干净的数据模型（data model）为基础的能够帮助你创建富文本，响应显示和编辑用户界面的JavaScript类库。任何时候你的UI部分需要动态更新（比如：更新取决于用户的操作或外部数据源变化）。KO可以帮助你实现由于它更简单并且很容易维护。

重要特性

• 优雅的依赖跟踪-无论何时你的数据模型改变你的需要变化的UI部分都会自动更新。

• 声明式绑定-通过一种简单易懂的方式连接你的数据模型到你的UI部分。你可以非常容易的运用任意的嵌套绑定上下文的方式来构建一个复杂的动态界面。

• 傻瓜式扩展-仅仅短短几行代码就可以做出可重用的新声明式绑定来实现用户自定义行为

额外的好处

• 纯净的javascript库：兼容所有的服务器端和客户端技术。
• 可以轻松添加到已有的web程序顶部：而不需要大的架构改变。
• 简洁的：压缩后只有13kb
• 兼容任何主流浏览器 (IE 6+、Firefox 2+、Chrome、Safari、其它)。
• 统一的规范(采用行为驱动开发) 意味着在新的浏览器和平台上可以正确的运行。

开发者如果熟悉Ruby on Rails (是一个可以使你开发，部署，维护 web 应用程序变得简单的框架。)或其它MVC技术可能会发现它是一个带有声明式语法的MVC实时form。从另一个意义上讲,你能想到可以把KO作为一种编辑JSON数据的方法而不用在乎它怎么工作。

OK，但是我们怎么使用它呢？ 开始的最快和最有趣的方式是通过互动教程。一旦你掌握了基本知识,然后在一个自己的项目中运用它了。

KO和jquery是对立关系，还是相互协作呢？

所有人都喜欢jQuery! 它是一个在页面里操作元素和事件的框架，非常出色并且易使用，在DOM操作上肯定使用jQuery，KO解决不同的问题。

如果页面要求复杂，仅仅使用jQuery需要花费更多的代码。 例如：一个表格里显示一个列表，然后统计列表的数量，Add按钮在数据行TR小于5调的时候启用，否则就禁用。jQuery 没有基本的数据模型的概念，所以需要获取数据的数量（从table/div或者专门定义的CSS class），如果需要在某些SPAN里显示数据的数量，当添加新数据的时候，你还要记得更新这个SPAN的text。当然，你还要判断当总数>=5条的时候禁用Add按钮。 然后，如果还要实现Delete功能的时候，你不得不指出哪一个DOM元素被点击以后需要改变。

Knockout的实现有何不同？

使用KO非常简单。将你的数据描绘成一个JavaScript数组对象myItems，然后使用模板（template）转化这个数组到表格里（或者一组DIV）。不管什么时候数组改变， UI界面也会响应改变（不用指出如何插入新行<tr>或在哪里插入），剩余的工作就是同步了。例如：你可以声明绑定如下一个SPAN显示数据数量（可以放在页面的任何地方，不一定非要在template里）：

There are <span data-bind="text: myItems().count"></span> items

就是这些！你不需要写代码去更新它，它的更新依赖于数组myItems的改变。同样， Add按钮的启用和禁用依赖于数组myItems的长度，如下：

<button data-bind="enable: myItems().count < 5">Add</button>

之后，如果你要实现Delete功能，不必指出如何操作UI元素，只需要修改数据模型就可以了。

总结：KO没有和jQuery或类似的DOM 操作API对抗竞争。KO提供了一个关联数据模型和用户界面的高级功能。KO本身不依赖jQuery，但是你可以一起同时使用jQuery， 生动平缓的UI改变需要真正使用jQuery。