BackboneJs入门学习[03]—Model实践(1)

BackboneJs入门学习之模块—Model实践(1)

上一篇中，我们简单了解了Backbone中Model这个模块。这一篇中，将具体介绍Model中的一些操作。

用一张图来回顾backbone中各个模块的关联：

Ok，切入本篇正题。

1. Model中对象属性的赋值方法

在Model中对属性的赋值可以使用两种方法：

1.方式一： 使用直接定义的方式赋值——设置默认值（defaults）

示例：

var Man=Backbone.Model.extend({
    initialize:function(){
       alert('Hello world.');
},
   //设置默认值
   defaults:{
     name:'张三',
     age:'38'
  }
});
//实例化
var man=new Man;
alert(man.get('name'));//使用get获取属性值

1.方式二：赋值时定义——set()
示例：

var Man=Backbone.Model.extend({
      initialize：function(){
              alert('Hello world');
  }
});
var man=new Man;
//使用set方法对man添加属性和属性值，这类似{key:value}的方式
man.set({name:'张三',age:'10'});
alert(man.get('name'));

怎么样？是不是很轻松！

2. 对象的方法

既然对象有属性，那就得要有方法了。

其实，在所有的定义或是赋值中，都是通过字典的方式来完成的，如extend
Backbone中德Model,以及定义方法和定义属性。所以，对方法的定义很类似。
示例：

  var Man=new Backbone.Model.extend({
      initialize:function(){
             alert('Hello world');

},
 defaults:{
    name:'张三',
    age:'10'
},
//定义方法
aboutMe:function(){
   return '我叫'+this.get('name')+',今年'+this.get('age')+'岁';
}
});
var man=new Man;
alert(man.aboutMe());//调用方法

3.监听对象中属性的变化——change

以上介绍了对象的属性和方法，那么当属性变化时该如何做出相应呢？Backbone中使用change事件进行监听

change事件:当属性发生变化时，就会被触发；

示例：

var Man=Backbone.model.extend({
      initialize:function(){
      alert('Hello world');
 //初始化时绑定监听
 this.bind('change:name',function(){
   var name=this.get("name");
   alert("你改变了name属性，值为:"+name);

});
},
defaults:{
     name:'张三'，
     age:'38'
},
aboutMe:function(){
  return '我叫'+this.get('name')+'今年'+this.get('age')+'岁';
}
});
var man=new Man;
man.set({name:'李四'});//将张三改为李四，于是触发change事件，弹出提示信息

这就相当于js中的onchange()事件。

每篇一语：
当你发现你喜欢做一件事情时，就应该持续的做下去！