Violence Analysis Backbone.js (5)

Okay, keep analyzing backbone and finish. previous Section , we have a clear analysis of ideas, this section on the basis of ideas to go.

Now I'm going to distinguish a few chunks of the position.

As the argument function (root, Backbone, _, $) {}, it wraps the main function of the Backbone.

From line28--line1610.

Backbone.events (Event)

From line68--line236.

Backbone.model (model)

From line238--line587.

Backbone.collection (Controller)

From line588--line982.

Backbone.view (view)

From line983--line1113

Backbone.sync (synchronous)

From line1114--line1211

Backbone.router (routing)

From line1212--line1312

Backbone.history (History)

From line1313--line1551

So it's gone? There are also 2 parts:

Initial Setup (initial setup)

From Line30--line80

Helpers (assistant)

From line1552--line1606

These 2 parts, the initial setting is to stay in our use to say, while the assistant is the last to say, or is used to say.

Well, the chunks are all divided, and we start with the Backbone.events event and say before:

1. First look at the official documentation

2. Try to use it.

3. Analyze how they are implemented

4. Summarize what is the use, come up with the words to be later combined with other instances

Let me just make a copy. Description:events is a module that can be fused to any object, giving the object the ability to bind and trigger a custom event. Events do not need to be declared prior to binding and can also pass parameters

I grabbed a few highlights (fused to any object module): module We liken it to a chunk of functionality, which contains a small piece of functionality. How to blend?

(Ability to bind objects and trigger custom events): Can bind the object to custom function, can trigger the object custom function.

(no need to declare before binding): Think about how we bind events to DOM elements, Domelement.onclick = Funct () {}, no need to declare to be solved?

(You can also pass parameters):

I copied the dome using events

1 var object = {}; 2 3 _.extend (object, backbone.events); 4 5 function (msg) {6       alert ("triggered" + msg); 7 }); 8 9 Object.trigger ("Alert", "an event");

　1. Define a Name object, do not misunderstand, the built-in initials are capitalized.

2.underscore extend,_.extend (parameter A, parameter B): Copies the properties of parameter B (object) to parameter a (object). This makes sense (fused to any object's module), let's create the object to copy the Backbone.event function, which is fused, I understand.

3.object This object combines the functions of backbone.events to use its functions.

4.object.on (binding event), which binds a custom event ' alert '. That's a good idea (binding a custom function to an object).

5.object.trigger (Execute event), executes a custom event ' alert ' that has been bound. This makes sense (can trigger the object custom function) (Note the parameter)

Above is with underscore extend,underscore is also backbone of necessary equipment, so in this way in not over, the official recommendation, but we still come to brainstorm, try another way.

I created an object cc and then called Backbone.on and Backbone.trigger with the created object cc. But the downside is at a glance.

1 var cc = {}; 2  function  (evt) {4 alert (' cc ' + ' + evt)}); 6  Backbone.trigger.call (cc, ' alert ', ' alert ');

　　

We're trying to use a delegate model. I create a CC object and associate it with backbone, the delegate pattern is like this, but when a object is associated to a B object, we try on this method, it will first look for this method within the A object, if there is no method, it will try to go to the B object to find, found can be used. They are a brotherly relationship. In fact, Cc.on is directly can be called, why I return to the CC object defined method, with a point to invoke it? Because. On is not a method of a object, this allows you to clearly understand the delegate pattern. The results are also well-done.

1 varCC =object.create (Backbone);2 3Cc.setevent =function(eventname,callback) {4 　　 This. On (eventname,callback);5};6 7Cc.getevent =function(EventName) {8 　　 This. Trigger (EventName);9};Ten  OneCc.setevent (' Alert ',function () { AAlert (' CC '); -}); -  theCc.getevent (' alert ');

　　

　　OK, the next section begins to analyze how backbone.events is implemented!

Violence Analysis Backbone.js (5)