五、Events与Model、Collection、View、Router、History的关系

来拘禁下代码

_.extend(Model.prototype, Events, {

})
_.extend(Collection.prototype, Events, {

})
_.extend(View.prototype, Events, {

})
_.extend(Router.prototype, Events, {

})

管事件模块mixin到这些像样的原型上去了。一句话,这多少个近似都独具Pub/Sub的力量,即都足以实现由定义事件,它们之间吧虽然得经波颇便宜的降耦合。倘若当累加数量、视图、逻辑的支行效果,这即便是成套Backbone的精彩了。

 

jQuery,相关:

冗余换性能-从Backbone的trigger伊夫nts说开了去

季、 特殊事件“all”

事件称为“all”,在trigger方法中,仔细看代码,你会意识trigger方法中调用了有限蹩脚trigger伊夫(Eve)nts,一蹩脚是经参数传上的轩然大波,另一样次等则一定啊“all”事件。

var events = this._events[name];
var allEvents = this._events.all;
if (events) triggerEvents(events, args);
if (allEvents) triggerEvents(allEvents, arguments);

trigger的平时实现就待将事件称为,参数传进,取哈希(这里是_events)上获该事件的富有handlers(存在于屡组里),挨个执行。但此处怎么各一样赖trigger调用还要单独赢得下all事件,然后实施也?

要是单纯看Backbone.伊芙nts模块,是特别麻烦知晓的。那么就招来下一切Backbone.js,看“all”事件于哪些地方使用及。最终发现就当Backbone.Collection中之所以到,且只一地处。

model.on('all', this._onModelEvent, this);

只有看就一行代码,依然难以理解。需要整合Backbone.Model和Backbone.Collection一起看。

此先简单说生,大家领会这行代码所在方法是Collection.add,在朝collection中上加model时举行的,即添加的model都谋面报一个“all”事件。而当model自身销毁(destroy)或修改(change)的上,需要公告该所在Collection。

 

例如,model销毁后,Collection需要以汇集中管其去,Collection的尺寸为得减一。model修改后,也待通知Collection,这样吃Collection添加的change事件也会硌。

立固然是“all”事件的实在用,往日曾想既然Backbone的View和通信都因让jQuery,那么事件模块也全然好用$.Callbacks。不曾想到还有一个出奇之“all”事件。

 

 

  • Events API
  • Events的用法
  • 伊夫nts内部数据结构 (_events/_listeners)
  • 出奇事件: “all”
  • Events与Model、Collection、View、Router、History的关系

 

标示符伊夫nts是内部的一个援,为切磋好,这里呢节省了眼前缀Backbone,这首稿子会于以下六只点分析

除此以外,事件模块的保有术还挂于了大局的Backbone上,假诺你的代码中需运用打定义事件(实现观察者格局),可以直接动用其。

其三、伊夫nts内部数据结构 (_events/_listeners)

相对来说,近期底里数据结构相比较简单。选择传统的先哈希,后反复组存储事件处理器目的,处理器对象上起callback和context及ctx。其内部有少个基本点目的_eventshe
_listeners,皆以下划线起初,表达及时是个体的(并非真的个人,一种植语法约定,真正私有可使用闭包实现),仅供内部用。

_events
这多少个哈希是默认是挂在Backbone.伊芙nts上,由于伊夫nts是一个目标,所以杀轻受Mix到另外想多从定义事件的切近或对象及。此时_events则挂于拖欠对象上。如Backbone.Model,Backbone.Collection,Backbone.View,当为其实例补充加于定义事件不时,_events则挂于它的实例对象上。

 

_events的构造如下

jQuery 1

_.extend(Backbone, Events);

 

_listeners 和
_events一样默认为是挂于Backbone.伊夫nts上。顾名思义,它是一个监听器,即好吧其余对象(具有Backbone.伊夫nts的具有方的目的)被抬高事件。它的key是盖字母“l”开首后和递增的数字组合,value是一个
“a mixin of Backbone.伊芙nts”。

 

_listeners的构造如下

jQuery 2

 

最终还要拿伊夫(Eve)nts上的装有办法还拷贝到标示符Backbone那个大局对象及,即受Backbone添加了如下方法。这时可以死方便之应用它们深受好的类添加起定义事件。

jQuery 3

 

事件模块Backbone.伊夫(Eve)nts是Backbone的中坚,Model、Collection、View都凭借它。

亚、伊夫(Eve)nts的代码鸟瞰

var Events = Backbone.Events = {
    on: function(name, callback, context) {
        // ...
    },
    once: function(name, callback, context) {
        // ...
    },
    off: function(name, callback, context) {
        // ...
    },
    trigger: function(name) {
        // ...
    },
    stopListening: function(obj, name, callback) {
        // ...
    }
};

var eventSplitter = /\s+/;
var eventsApi = function(obj, action, name, rest) {
    // ...
};
var triggerEvents = function(events, args) {
    // ...
};
var listenMethods = {listenTo: 'on', listenToOnce: 'once'};

_.each(listenMethods, function(implementation, method) {
    Events[method] = function(obj, name, callback) {
        // ...
    };
});

Events.bind   = Events.on;
Events.unbind = Events.off;

_.extend(Backbone, Events);

1.
先期定义了一个对象(单例),直接挂及了接口方法on/once/off/trigger/stopListening,注意即使伊芙(Eve)nts头字母大写,这里不是概念一个类似如故构造器,而是一个单例对象

   
剩下的变量和函数都是赞助这些目标的,它们还于闭包空间里,外部不可看使eventSplitter、eventsApi等

  1. eventSplitter用来实现空格间隔一坏上加五只事件,如 .on(‘event1
    event2’, handler)

3.
eventsApi实现之慌抢眼,它扶助on/once、off、trigger完成事件的增长、删除、派发。你会见发现此处是一个递归调用,来落实部分批量长事件。如

// 空格间隔批量添加多个事件
.on('event1 event2', handler)

// 哈希对象批量添加
var obj = {
    event1: handler1,
    event2: handler2,
    event3: handler3
}
.on(obj)
  1. trigger伊夫nt匡助trigger方法实现派发事件,它的落实多少特别,见
    冗余换性能

5.
后的listenMethod和一个each迭代,会吃伊芙nts添加少单新章程listenTo和listenToOnce

6.
更下两行被on/off分别取得了别名bind/unbind。其实这吗是以配合老版,最早的本添加/删除事件也bind/unbind。

  1. 最后一行将伊夫(Eve)nts掺合交全局的Backbone对象上了

拓扑图如下

jQuery 4

 

 

一、Events API

1.0在此以前只有供了三独中央措施
on/once/off/trigger,1.0从头增多了多少个实用方法
listenTo/listenToOnce/stopListening。

jQuery 5

以下是各类艺术的意思

  • on 添加自定义事件
  • off 删除自定义事件
  • trigger 派发自定义事件
  • once 添加特举行同一差的自定义事件 (内部倚重让_.once)
  • listenTo 添加一个考察对象
  • listenToOnce 添加一个止执行同一破的观赛对象
  • stopListening 删除添加的观测对象

 

相关文章