Backbone.js源码浅介

　　终于看到一个只有一千多行的js框架了，于是抱着一定可以看懂他的逻辑的心态，查看了他的整个源码，进去之后才发现看明白怎么用容易，看懂怎么写的就难了，于是乎有了这篇博客的标题：浅介，只能粗浅的介绍下Backbone.js的调用逻辑了。在Backbone.js中共有7个类对象，从网上盗图一发，图上清晰的展现了各个对象的逻辑关系。

　　

　　首先出场的是Event对象，仔细看看Event只是对JS的事件绑定进行了重新的封装， 所以不用深究。

　　看起来高大上的Model对象，Model对象是所有数据对象模型的基类，能够动态的添加一些属性值。Model可以做到当对象方法改动后立即发出响应，这点主要在Model的set方法中来实现，在Model中，所有的数据会保留两个版本，一个上一次修改后的版本，一个是当前版本，如果当前版本和上一次修改的版本不同的时候则触发change函数。Model也实现了到服务器后台的操作，能够事实把数据提交到后台或者从后台提取数据。

　　在次是Collection模型，Collection只是个苦工，相当与Vector的数据结构，Colletcion负责维护一系列数据模型的数组，他对数组对象进行了再次封装，为了让他更加专业的干活，Collection还封装了一些可以直接操作模型的方法。

　　其次是Router类的实现。使用Asp.net 的MVC的人知道，router是连接服务器和网页的映射模块，从客户端发来的请求会经过Router来获得应该去调用哪个后台处理函数。在Backbone.js中Router也有类似的功能，在单页面应用程序中你可能需要给程序的URL传参数来重新刷新页面，比如说一个可以翻页的表格，合理的想法是，当你点击下一页时再重新从数据库中获取数据，呈现到页面上，而不是一次性的将所有数据读取进来。这样就需要通过给URL传参数来达到这样的效果了，这就是Router的功能，Router将根据URL中的参数调用相应的函数来更新页面。

　　History类提供了对Router管理的操作，包括监听URL的变化，当发生事件时就会首先从History将事件匹配到Router中，然后从Router进行调用事件处理。

　　View类， View类用于连接界面元素与model，当model发生改变的时候通过视图中绑定的change事件，当数据发生变化时重新渲染元素。

　　Sync类：sync类用于在向服务器发送同步数据请求。

　　综上所述，我们大致可以看出了Backbone.js各个之间联系的脉络。Model, View是一个组合，当我们触发一定的动作调用相应的事件函数，这个事件函数会修改Model中的数据成员，数据被修改后，程序会自动连接后台，并且响应到界面上。Router和History是另一个组合，当我们修改了URL后，程序在前台向后台索取数据，并更新我们的界面。

BackBone.js是一个MVC架构吗？

以我目前的理解来看，Backbone并不算是一个三层架构，而是一个两层架构， Model和View分别承担了Controller的部分功能，不过宏观上看来View更像是Controller，而真实的View则是我们的网页吧。

参考链接：

http://documentcloud.github.io/backbone/#Router

http://www.cnblogs.com/xuwenmin888/archive/2013/05/27/3101445.html