backbond Model实现

backbond中的M,指的是模型,即存放数据以及数据相关逻辑的单位。在分析其结构之前,先看一下其调用过程。

<script>

    (function ($) {
        World = Backbone.Model.extend({
                   initialize: function(){
                alert(‘Hey, you create me!‘);
            },
            defaults: {
                name:‘张三‘,
                age: ‘38‘
            }
        });

        var wodld = new World({x:1});
        var x = new World({y:2});

    })(jQuery);

backbond 通过Backbone.Model.extend方法得到一个World类(为了不让World和其实例化结果混淆,这里把World称为类,实例化结果称为对象),再通过实例化World来获得实例对象,并调用类中的initialize方法。这看起来和java很相似,也就是一种面向对象的编程方法。

在前面的backbond架构分析中,我们知道Backbone.Model.extend就是extend函数,从extend入手分析,先看一下extend在内部的实现。

var extend = function(protoProps, staticProps) {
    var parent = this;
    var child;

    // 如果传入的对象中存在属性为construtor,那么将其构造函数作为child
    // 否则,child作为一个调用父类的方法
    if (protoProps && _.has(protoProps, ‘constructor‘)) {
      child = protoProps.constructor;
    } else {
      child = function(){ return parent.apply(this, arguments); };
    }
    // 调用underscore的extend方法 将传入的第二个参数添加进child
    _.extend(child, parent, staticProps);

    // 对原型链进行设置 通过创建一个surrogate来使得child的原型链获得parent原型链
    // 如果直接赋值 即child.prototype = parent.prototype,那么对child.prototype的改造也会影响到parent.prototype
    var Surrogate = function(){ this.constructor = child; };
    Surrogate.prototype = parent.prototype;
    child.prototype = new Surrogate;

    // Add prototype properties (instance properties) to the subclass,
    // if supplied.
    if (protoProps) _.extend(child.prototype, protoProps);

    // 最后,由于上面的改造原型链,需要将child的上一层原型改为parent
    child.__super__ = parent.prototype;
    return child;
  };

在extend中,最后返回的是一个函数,也就是上面例子中的World类,extend中的parent也就是Backbone.Model,即使得返回的函数的原型上具有Model和我们传入的属性。

接下来就是Model函数了,

var Model = Backbone.Model = function(attributes, options) {
    //设置属性
    var attrs = attributes || {};
    options || (options = {});
    this.cid = _.uniqueId(‘c‘);
    this.attributes = {};
    if (options.collection) this.collection = options.collection;
    if (options.parse) attrs = this.parse(attrs, options) || {};
    attrs = _.defaults({}, attrs, _.result(this, ‘defaults‘));
    this.set(attrs, options);
    this.changed = {};
    //调用initialize函数
    this.initialize.apply(this, arguments);
  };

我们知道,在js中使用new字符调用一个函数时,也就是创建了一个对象,this指向了这个对象并使该对象继承了构造函数的原型链,最后如果返回结果不是一个对象的话就返回这个对象。

那么在上面的例子中,最后通过了var world = new World({x:1});调用了World类,

而一开始我们在构造World类时并没有传入具有属性为constructor的对象,也就是说 World = function(){ return BackBond.Model.apply(this, arguments); };

其中的this就是新创建的对象,那么就在新创建的对象下调用了Backbond.Model,最后返回了这个对象,也就是我们上面的world对象。

最后我们在调试器打印出world对象。

最后,总结一下backbond具体的设计思路:

   1: 定义Model函数,并在其原型上设置一系列方法。

2.1: 通过extend函数,获得一个函数(也就是我们创建的类),其原型继承了Model函数原型

2.2: 并根据我们传入的参数设置类为一个构造函数或者通过apply将上下文设置为我们的实例化对象来调用Model函数的函数(即初始化,并调用initlize函数,相当于java的构造函数)。

2.3: 最后返回类。

   3: 实例化父类,获得对象。

这样的设计最终会使得我们像使用面向对象语言一样来使用Js。(类,构造函数,对象,继承...)。

时间: 2024-09-30 07:03:33

backbond Model实现的相关文章

backbond Model方法(set)

backbond的Model,其中存在一些操作属性的方法,而在这些方法中,最重要的就是set方法,其余的方法大部分都基于这个方法实现的,在backbond开发版中,也说了该方法是model中的核心方法. 在分析之前,先看一下官方文档的描述: 也就是说,可以传入{key-value}{obj}两个对象作为参数,也可以传入key,value,{obj}三个作为参数,其中obj是用来实现当调用set方法时,是否进行其他操作. 接下来,可以先看代码: set: function(key, val, op

Data Model for Message Receiver

1. Physical Data Model 2. SQL Statements drop database MessageReceiver go /*==============================================================*/ /* Database: MessageReceiver */ /*==============================================================*/ create dat

springMVC:modelandview,model,controller,参数传递

转载:http://blog.csdn.net/wm5920/article/details/8173480 1.web.xml 配置: copy <> ></> ></> > >> ></> ></> > ></> </> <> ></> ></> </> 这样,所有的.htm的请求,都会被Dispatche

NHibernate框架与BLL+DAL+Model+Controller+UI 多层架构十分相似--『Spring.NET+NHibernate+泛型』概述、知识准备及介绍(一)

原文://http://blog.csdn.net/wb09100310/article/details/47271555 1. 概述 搭建了Spring.NET+NHibernate的一个数据查询系统.之前没用过这两个框架,也算是先学现买,在做完设计之 后花了一周搭建成功了.其中,还加上了我的一些改进思想,把DAO和BLL之中相似且常用的增删改查通过泛型T抽象到了DAO和BLL的父类中,其DAO 和BLL子类只需继承父类就拥有了这些方法.和之前的一个数据库表(视图)对应一个实体,一个实体对应一

asp.net mvc 提交model 接收不了

[HttpPost]        //[ValidateInput(false)]        public ActionResult AddNews1(_54Young_News_Model.model.gou54contentall contentmodel, _54Young_News_Model.model.gou54user usermodel)        {} 发现用一些特殊符号提交不了, 然后以为说前端问题,把model去掉就可以了. 后面觉得是因为有特殊符号影响到转mod

Django操作model时,报错:AttributeError:’ProgrammingError’ object has no attribute ‘__traceback__’

原因:在Django项目下相应的应用下面的models.py配置的model(也就是class)没有创建成相应的表. 这是怎么回事呢? 首先,将models.py里面的model创建成对应的数据库表的执行命令(DOS命令)为:manage.py syncdb. 但是我自己的电脑上执行该命令时,显示.Unknown command:syncdb.执行,manage.py help后的确没有发现这个子命令.最后网上搜索发现这个命令已经在Django1.9里面取消了.并且stackoverflow里面

使用AutoMapper实现Dto和Model的自由转换(上)

在实际的软件开发项目中,我们的"业务逻辑"常常需要我们对同样的数据进行各种变换.例如,一个Web应用通过前端收集用户的输入成为Dto,然后将Dto转换成领域模型并持久化到数据库中.另一方面,当用户请求数据时,我们又需要做相反的工作:将从数据库中查询出来的领域模型以相反的方式转换成Dto再呈现给用户.有时候我们还会面临更多的数据使用需求,例如有多个数据使用的客户端,每个客户端都有自己对数据结构的不同需求,而这也需要我们进行更多的数据转换. 频繁的数据转换琐碎而又凌乱,很多时候我们不得不:

使用AutoMapper实现Dto和Model的自由转换(中)

在上一篇文章中我们构造出了完整的应用场景,包括我们的Model.Dto以及它们之间的转换规则.下面就可以卷起袖子,开始我们的AutoMapper之旅了. [二]以Convention方式实现零配置的对象映射 我们的AddressDto和Address结构完全一致,且字段名也完全相同.对于这样的类型转换,AutoMapper为我们提供了Convention,正如它的官网上所说的: 引用 AutoMapper uses a convention-based matching algorithm to

使用AutoMapper实现Dto和Model的自由转换(下)

书接上文.在上一篇文章中我们讨论了使用AutoMapper实现类型间1-1映射的两种方式--Convention和Configuration,知道了如何进行简单的OO Mapping.在这个系列的最后一篇文章我想基于我们的需求讨论一些中级别的话题,包括:如何实现类型体型之间的映射,以及如何为两个类型实现多个映射规则. [四]将一个类型映射为类型体系 先回顾一下我们的Dto和Model.我们有BookDto,我们有Author,每个Author有自己的ContactInfo.现在提一个问题:如何从