Write method of backbone

Source: Internet
Author: User

Discuss the writing class of backbone from two perspectives

    1. The write class method inside the backbone. How is the class of the backbone defined, such as model, collection, and view?
    2. Backbone external write class method, how to use the class provided by backbone to define your own class

 

I. Writing Methods inside Backbone

Backbone is provided to the clientProgramThe class is written by constructor + prototype. The class of backbone. ModelCodeRoughly as follows:

 
// Define the constructor VAR model = backbone. model = function (attributes, options ){//... this. set (attrs, options); this. changed = {}; this. initialize. apply (this, arguments) ;}; // extended prototype. Many methods are added to the prototype, such as events _. extend (model. prototype, events ,{//...});

This is a traditional method, in which backbone. Collection/backbone. View/backbone. router/backbone. History are defined.

 

Ii. Backbone external write class

For external writing methods, you have to mention the extend method, which is defined at the bottom of backbone. js. Less than 30 lines of code, it is private and cannot be accessed from outside.
That is to say, this method is only used inside backbone and serves other modules.

 

In fact, this statement is not rigorous. Although extend cannot be accessed directly, it uses only one line of code

 
Model. Extend = collection. Extend = router. Extend = view. Extend = history. Extend = extend;

Turn to the following method

    • Backbone. model. Extend
    • Backbone. collection. Extend
    • Backbone. View. Extend
    • Backbone. Router. Extend
    • Backbone. History. Extend

In this case, external access is still available.

 

Write a private function in a closure and assign the function to multiple classes or class prototypes. These writing methods are not uncommon, which saves memory and only one function instance.

In addition, do not confuse extend and _. Extend here. _. Extend is a lower-layer method provided by underscore for Mixin objects. Here, extend is used to write classes.

 

Introduction to extend

    1. It accepts two parameters, both of which are object types.
    2. It returns a class (constructor, function ).
    3. All attributes and methods of the first parameter are copied to the class prototype (Instance Object)
    4. All attributes and methods of the second parameter are copied to the class (static attributes and methods of the class)
    5. If the constructor attribute exists in the first parameter, it is returned at the end; otherwise, the child provided internally is returned.
    6. The returned class has a special attribute _ super __.

In the sixth point above, it is very convenient to get the parent class prototype, and then get the parent class constructor, and then call the parent class in the subclass, which is similar to the super keyword in Java.

 

Take the example for details

1. Both parameters are of the object type. The first extension is the prototype method, and the second extension is the class method.

VaR instanceobj = {Name: '', getname: function () {}, setname: function (name) {}} var classobj ={ trim: function (STR ){}, mix: function () {}} // generates a new custommodel class, which has backbone. all model methods var custommodel = backbone. model. extend (instanceobj, classobj) // copy the instanceobj attribute to custommodel. on Prototype _. each (['name', 'getname', 'setname'], function (ATTR) {console. log (ATTR in custommodel. prototype)}) // The classobj attribute is copied to custommodel _. each (['trim', 'mix'], function (ATTR) {console. log (ATTR in custommodel )})

 

2. If the constructor attribute exists in the parameter, it will be returned at last; otherwise, the child provided internally will be returned.

This actually tells the user to customize the constructor, instead of using the internal child.

Function myconstructor (name, age) {This. name = Name; this. age = age;} var custommodel = backbone. model. extend ({constructor: myconstructor, getname: function () {}, setname: function () {}}) var M1 = new custommodel ('john', 30) console. log (m1.constructor === myconstructor) // true

 

3. The returned class has a special attribute _ super __, which is used to conveniently obtain the parent class prototype, get the parent class constructor, and finally call the parent class in the subclass.

 
Function person (name, age) {This. name = namethis. age = age} person. extend = backbone. model. extend // use the extend of backbone, O (sort _ worker) O ~ Function manconstructor (name, age) {manconstructor. _ super __. constructor. call (this, name, age) // call the parent class constructor this. gender = 'male'} var man = person. extend ({constructor: manconstructor}) var man = new man ('john', 30) console. log (man) // manconstructor {name = "John", age = 30, Gender = "male "}

 

Summarize the writing methods of backbone.

The internal Writing Method of backbone is constructor + prototype. External write classes exist through extend, and both write classes and inheritance exist.

1. Write the class through the extend method of model (View/router, etc.), and the generated class directly inherits the model (View/router, etc)
2. If the written class is not the class provided by backbone, you can take out the extend method like 3.

 

This method is usually used for Backbone Development. It forces the code to be divided into several layers, and some utility functions are provided by underscore.

For browser development, Dom and HTTP Communication operations are generally provided by jquery or zepto. Almost all the code you write is concentrated on business processing. It is nothing more than model, collection, view, router, and history ).

 

 

Related:

Javascript Writing Method

Javascript Inheritance Method

 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.