Popush系统架构学习体会(0)—Node.js+Socket.io+Backbone.js

前言

这篇文章原来应该在起码一周之前就该诞生的，但是由于那时想对Popush的系统细节有一个更深入的了解，再加上之后一直被其他作业所困扰，学习进度停滞不前，于是就先写了这一篇文章。至于为何编号是0而不是1，除了因为程序员的起始编号是0外，还有是因为这篇文章几乎没有关于Popush系统的细节内容......

正文

如果你忽略了上面的前言，那么恭喜你，你的选择是对的！前面的内容基本上是毫无意义，纯粹是凑字数用的。（好像这句话也在凑字数......）好，下面开始正题。Popush系统代码基本上是以Node.js为骨架，并使用到Socket.io作为实时应用，Backbone.js控制前端数据交互及路由，MongoDB为数据库，还使用到Underscore.js作为补充函数库，CodeMirror为编辑器插件。这一大堆东西一波袭来，说白的我真有点招架不住。本文将主要讨论一下Node.js、Socket.io及Backbone.js，其他东西暂待研究......

Node.js

Node.js的一个有效学习网站是：http://nodeschool.io。看了这个后可以跳过我这部分的废话。

Node.js有一个经常使用的套件：npm。基本上要用到Node.js就离不开npm，npm的详细用法暂待深究，本文暂不讨论。

以Node.js实现的系统中的代码开头大多都离不开下面的两种：

var xx = require('xx');

module.exports = …

这两种分别是甚么意思呢？以我目前的理解，require大概就跟C语言中的#include差不多，就是引用一个外部的文件，而module.exports就是定义了一个可require的文件，也就是跟C语言中的头文件差不多了。需要注意的是module.exports必须是一个object或function，不过以Javascript强大的object机制，对我们的使用也已十分足够了。

例子：

以下是一个名叫function.js的文件。

// File name: function.jsmodule.exports = {    hello : function() {        console.log('hello world!');    }}

那么我们只需在同一目录下的任何文件中前加入

require('./function.js');

就能调用function.js中的这个object了。例如在function.js所在目录中有另一个文件run.js:

// File name: run.jsvar hello = require('./function.js');hello.hello();

那只要执行

node run.js

就能在终端看到hello world!了

Node.js提供了一个强大的框架服务，它本身提供了一些实用的模块，如http、fs等，（具体实现可参考API文档：http://nodejs.org/api/），也能通过npm下载一些额外的库来丰富系统功能。

Socket.io

Socket.io就是其中一个上文提及到的额外的库。它的安装方式为

npm install socket.io

Socket.io提供了一个无比强大的实时同步功能，想感受一下它的魅力的话，可到http://weplay.io/玩一玩口袋妖怪。你也可以跟着http://socket.io/get-started/chat/来一步一步建立一个聊天室程序。

Socket.io最重要的操作基本上有2个：emit和on

emit负责发送事件消息，on负责监听事件并进行消息处理，它们详细的使用方法还是去看一看Socket.io的API吧：http://socket.io/docs/

Backbone.js

Popush是一个单页面的网页系统，Backbone.js就是这个单网页系统的后盾。Backbone.js应用了MVC架构，但这个MVC有点特别，它是Model、View和Collection，页面导向它使用了Router。不想看我废话的可以出门左转：http://backbonetutorials.com/（可能有点慢，因为网页好像会卡在加载Tweet这个按钮= =），因为这部分也是本文的最后一部分了。

Model

Model基本上就是C++中的一个class，我们可以在里面定义变量和方法。与C++不同的地方是，Backbone.js能监听某个成员变量的值的变更并进行处理。

View

由于系统是单页面的，重构页面的工作就只能使用修改DOM元素的方法来实现。于是我们能使用View中的el属性对页面中的DOM元素进行一个绑定。绑定完成后就能监听这个元素的事件，用户在这个元素的操作就能反映到Backbone.js中。

Router

Backbone.js的页面导向将使用Router进行控制。Backbone.js使用网址作为导向信息，将在主机名的后面加上/#/在加上导向信息，例如：http://example.com/#/posts/120。

在routes中应先定义路由规则，比较值得注意的是":params"和"*splats"。":params"代表action之后的值为参数值，如定义了一条规则是：

"posts/:id"

则输入

http://example.com/#/posts/120

时，120将是参数，即id。

而"*splats"则是把action之后的所有东西作为参数值，如定义了一条规则是：

"download/*path"

则输入

http://example.com/#/download/user/images/hey.gif

时，path将会是user/images/hey.gif，而不是user。

Collection

Collection其实就是一个Model的集合，可理解为Model的一个列表实例。

结语

这篇文章就到此结束了，由于准备时间较仓促，有些地方的描述不是十分详尽，有些地方的描述也不是十分到位。至于会不会出现下一篇学习体会，我相信是会出现的，只不过是不能确定会涉及什么内容罢了。

由于本人才疏学浅，学习时间又不够充裕，本文难免存在谬误，若上面有任何错处，欢迎向本人指正。