前端MVVM学习之KnockOut(一)

MVVM理解

MVVM即Model-View-viewModel，是微软WPF和MVP(Model-View-Presenter)结合发展演变过来的一种新型架构框架。



MVVM设计模式有以下优点:

(1)低耦合:model的修改不会影响视图的展现，一个ViewModel可以绑定到不同的View上，当View变化，Model可以不变，当model变化，view也可以不变。

(2)开发独立性：前端人员可以更专注界面的开发，后端专注逻辑和数据的开发。

(3)可重用性：一个viewModel可以对应多个视图，比如pc版和手机版视图，而ViewModel可以只用一个。

(4)方便单元测试

以上是一些简单的理解，MVVM的优势，还需要更多的实践才能感觉出来，当然，MVVM也有它的适应场合，只有在它适合的项目中，我们才能说他是有优势的。比如MIS系统就比较适合用MVVM设计模式来提高开发效率，而网站型的程序用MVVM就没什么优势。

前端MVVM

目前，已经有不少js库实现了前端mvvm设计模式，方便js代码和前端标签解耦。比较好的有KnockOut,它的官网有如下一句话：

Simplify dynamic JavaScript UIs with the Model-View-ViewModel(MVVM)patter。大概中文意思就是:通过MVVM设计模式来简化前端动态js和ui的开发。 主要是通过声明绑定、自动UI刷新、依赖跟踪、模板等。