var People = Backbone.Model.extend({
     
 });

 var Man = People.extend({

 });

  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 = {};
     this.initialize.apply(this, arguments);
   };

model.set(attributes, [options])

  set: function(key, val, options) {
     //......

      // key值可以是鍵值對，也可以是一個字符串,將賦值傳入attrs屬性中  
    if (typeof key === 'object') {
     attrs = key;
     options = val;
    } else {
     (attrs = {})[key] = val;
    }

   // ....

    //對設(shè)置的值進(jìn)行校驗 
      if (!this._validate(attrs, options)) return false;
    unset = options.unset; // unset為true時會刪除設(shè)置的值,unset方法就是通過 set(key,val,{unset:true})去實現(xiàn)的
   
    //當(dāng)對象正在被被設(shè)置的時候，不給 previousAttributes 賦值
    if (!changing) {
     this._previousAttributes = _.clone(this.attributes);
     this.changed = {};
    }
 
    current = this.attributes, prev = this._previousAttributes;
 
    //如果對Id進(jìn)行了設(shè)置，則對對象的id屬性也進(jìn)行改變
    if (this.idAttribute in attrs) this.id = attrs[this.idAttribute];
 

    //進(jìn)行 設(shè)置或者是刪除操作
    for (attr in attrs) {
     val = attrs[attr];
     if (!_.isEqual(current[attr], val)) changes.push(attr);
     if (!_.isEqual(prev[attr], val)) {
      this.changed[attr] = val;//為model的changed進(jìn)行設(shè)置
     } else {
      delete this.changed[attr];
     }
     unset ? delete current[attr] : current[attr] = val;//如果unset被設(shè)置成true了，則進(jìn)行刪除操作
    }
 
    //在silent不為false 的情況下，進(jìn)行change:attr事件發(fā)送
    if (!silent) {
     if (changes.length) this._pending = options;
     for (var i = 0, l = changes.length; i < l; i++) {
      this.trigger('change:' + changes[i], this, current[changes[i]], options);
     }
    }
 

    //觸發(fā)change事件
    if (changing) return this;
    if (!silent) {
     while (this._pending) {
      options = this._pending;
      this._pending = false;
      this.trigger('change', this, options);
     }
    }
    this._pending = false;
    this._changing = false;
    return this;
   
  }

model.save([attributes], [options])

  save: function(key, val, options) {     
    // ......
 

 
    //當(dāng)設(shè)置了wait屬性true的時候 , save方法先不執(zhí)行set方法(不觸發(fā)change事件),只執(zhí)行validate
    if (attrs && !options.wait) {
     if (!this.set(attrs, options)) return false;
    } else {
     if (!this._validate(attrs, options)) return false;
    }

    //如果wait為true,設(shè)置this.attributes
    if (attrs && options.wait) {
     this.attributes = _.extend({}, attributes, attrs);
    }
 

    // .....
   
    var model = this;
    var success = options.success;
    options.success = function(resp) {
     // Ensure attributes are restored during synchronous saves.
     model.attributes = attributes;
     var serverAttrs = model.parse(resp, options);
     //如果wait為true , 那么會在請求返回之后才進(jìn)行set操作
     if (options.wait) serverAttrs = _.extend(attrs || {}, serverAttrs);
     if (_.isObject(serverAttrs) && !model.set(serverAttrs, options)) {
      return false;
     }
     if (success) success(model, resp, options);
     //觸發(fā) sync 事件
     model.trigger('sync', model, resp, options);
    };

    //生成XHR onerror 回調(diào)函數(shù)
    wrapError(this, options);
    //選擇方法
    method = this.isNew() ? 'create' : (options.patch ? 'patch' : 'update');
    if (method === 'patch') options.attrs = attrs;
    xhr = this.sync(method, this, options);
 
    // Restore attributes.
    if (attrs && options.wait) this.attributes = attributes;
    //返回xhr對象
    return xhr;
  }

  var viewOptions = ['model', 'collection', 'el', 'id', 'attributes', 'className', 'tagName', 'events'];
 var View = Backbone.View = function(options) {
   this.cid = _.uniqueId('view');
   options || (options = {});
   _.extend(this, _.pick(options, viewOptions));
   this._ensureElement();
   this.initialize.apply(this, arguments);
   this.delegateEvents();
 };

view.setElement(element)

   setElement: function(element, delegate) {
    if (this.$el) this.undelegateEvents();//如果已經(jīng)存在this.$el，進(jìn)行事件解綁

    //對$el進(jìn)行賦值，本質(zhì)是一個jquery或者是 Lo-Dash and Zepto 對象
    this.$el = element instanceof Backbone.$ ? element : Backbone.$(element);
    //把dom element 賦值給el
    this.el = this.$el[0];

     //如果沒有顯式傳值,則進(jìn)行事件綁定
    if (delegate !== false) this.delegateEvents();
    return this;
   }

  _ensureElement: function() {
     //如果已經(jīng)對el進(jìn)行設(shè)置，直接調(diào)用setElement方法
    if (!this.el) {//如果沒有設(shè)置，生成一個元素對象，再調(diào)用setElement方法
     var attrs = _.extend({}, _.result(this, 'attributes'));
     if (this.id) attrs.id = _.result(this, 'id');
     if (this.className) attrs['class'] = _.result(this, 'className');
     var $el = Backbone.$('<' + _.result(this, 'tagName') + '>').attr(attrs);
     this.setElement($el, false);
    } else {
     this.setElement(_.result(this, 'el'), false);
    }
  }

delegateEvents([events])

    // *{"event selector": "callback"}*
   //
   //   {
   //    'mousedown .title': 'edit',
   //    'click .button':   'save',
   //    'click .open':    function(e) { ... }
   //   }

   delegateEvents: function(events) {
      //如果不存在events,則直接返回
      if (!(events || (events = _.result(this, 'events')))) return this;
   
      //先解除所有的事件綁定
      this.undelegateEvents();
   
      //處理每個事件
      for (var key in events) {
       var method = events[key];
       //解析回調(diào)函數(shù)
       if (!_.isFunction(method)) method = this[events[key]];
       if (!method) continue;
   
       //對選擇器進(jìn)行分析
       var match = key.match(delegateEventSplitter);
       var eventName = match[1], selector = match[2];
       method = _.bind(method, this);
   
       //綁定的事件名都是以 eventName + '.delegateEvents' + cid 組成,
       //這么做能夠在undelegateEvents的時候選擇到這個View的所有事件
       eventName += '.delegateEvents' + this.cid;
       if (selector === '') {
        this.$el.on(eventName, method);
       } else {
        this.$el.on(eventName, selector, method);
       }
      }
      return this;
   }