投了个简历,师兄要我完成一个任务,要求必须要用Backbone,虽然之前一直都有听过Backbone的大名,但是它是什么,拿来干什么的还真的是一无所知,正好今天趁机了解一下。
以下内容是我自己学习网上教程后自己的理解和归纳,如有错,望指出。(=_=不过这博客也没人看吧)
传统的MVC模式是把模型modes和视图view分离,通过控制器来连接它们。而Web页面本身就是一个大的view,不容易分离。
那Backbone到底是个什么鬼?
Backbone就是一个实现前端MVC模式的JS库,而且最重要的是,它依赖underscorejs库
那什么时候要用到Backbonejs呢?
应用范围:具有复杂逻辑的单页面,原因是易于操作DOM和操作JS代码。
“原来如此”
------------------------------------------------------------------------------------------------------------------------------------ -----------------
那就先说说Backbone怎么个MVC法吧
M:模型M在前端中就是指数据,比如JSON,数组等。
而M在Backbone中就是指数据模型Model,和模型集合器Collection这两块,按我自己的理解,如果说Model是指单条数据的话,Collection就是一个数据集合,或者说Collection就是Model的容器。
查看Backbone的中文API,有这么一句话:"Models(模型)是任何Javascript应用的核心,包括数据交互及与其相关的大量逻辑: 转换、验证、计算属性和访问控制。你可以用特定的方法扩展"。
话不多说,先来看看怎么创建模型对象吧。
var model=new Backbone.Model();
还可以给构造函数添加实例属性和类属性
这个得说说extend,它可以传参,参数是以名值对的对象形式,第一个参数是设置实例属性,第二个参数是设置类属性
var Apple=Backbone.Model.extend({
initialize:function(){
alert('I am an apple');
}//这个函数会在Model被实例化时被调用
});
var a1=new Apple;
改变属性时:
var Apple=Backbone.Model.extend({
initialize:function(){
alert('I am an apple');
this.bind("change:name",function(){
var name=this.get('name');
alert("名字改变为:"+name);
});
},
default:{
name:"apple"
}
});
var apple=new Apple;
apple.set({name:"banana"});