从 BackboneJS 的源码开始说事件模型

为何要事件模型

先从 BackboneJS 开始提及。BackboneJS 设计的比较好的一部分代码就是事件相关的内容,传送门:
http://backbonejs.org/docs/backbone.html#section-13javascript

jQuery 里面用到最多的就是bind相关的操做,为一个按钮绑定点击事件,给他解绑一个事件或者解绑全部事件,这一类的事件都是面向Dom对象。富应用中还须要一类孤立于DOM的事件,他们也须要相似添加事件、删除事件、解绑事件和触发事件。例如监测URL的变化,在其余地方可能绑定了不少事件,可是真实变化的时候只须要触发一下边能执行全部方法。html

事件模型的代码

最终我本身框架里面写的事件很大部分参考了 BackboneJS ,具体代码传送门:
https://github.com/vincenting/HaiyiYun/blob/master/src/vintjs.js#L175java

主要的功能包括绑定 on ,解绑 off ,触发 trigger 。on 最终期待的参数是(事件名称,回调函数,回调函数上下文),off最终期待的参数是(事件名称[,回调函数][,回调函数上下文]),trigger 最终期待的参数是(时间名称[,args...])。可是为了灵活,还须要一些灵活的参数,例如时间名称容许是多个事件名称以空格分开,以及以对象的形式同时传入名称和回调函数。因而 BackboneJS 中使用了eventsApi 进行统一的处理。git

题外话-内存洁癖

Javascript 里面写[]其实是 new Array,所以很容易无心中产生不少使用很临时的列表对象,例如一些临时列表,做为参数使用 apply 传递给函数。对于一个列表来讲,最快的清空方法就是修改他的length,以下github

var arr = [1,2,3,4];
arr.length = 0;
console.log(arr);

以后 arrObj 内容便会被释放。这样的对象能够屡次使用,可是非临时的变量必定不能使用。缘由以下:app

var arr = [1,2,3,4];
var new_list = arr;
arr.length = 0;
console.log(new_list[0]);

相同的 Object 也能够运用相似的方法来重复使用。这些都是为了尽可能减小对象的新建,页面一直开着什么状况都有可能发生,其余对象也是如此,字符串、函数、正则对象。框架

可能用到事件的地方

  • 以前有提到的url变化的时候会触发事件,这些事件可能包括去寻找对应的路由并解析,对当前状态存在的事件统一解绑,删除Dom等等。
  • 控制器间的通讯也会用到事件模型。一个控制器中触发了一个事件,而后事件被触发去和其余控制器通讯。
  • 数据和视图的绑定也须要使用事件。一个数据更新了调用什么方法去更新视图,一个列表删除或者添加数据了又去调用什么方法去更新视图。
  • 还有就是系统内部的解耦等等。

完成事件以后就须要去监听url的变化而且解析,以及一些相似于后台的url处理方法。(更新待续)函数

相关文章
相关标签/搜索