(4)模型和数据
(1)MVC 和 命名空间
var User = { getData:function(){ //$ajax get data } }; User.getData();
用模型的属性保存至命名空间的做法可以足球报不会产生冲突,但是我们写成一个类的形式去使用,而不是一个简单的对象
var User = function(){}; User.prototype.destory = function(){}; var user = new User(); user.destory();
(2)构建对象关系映射ORM
ORM是一个包装了一些数据的对象层,以往的ORM常用于抽象SQL数据库,但在这里ORM只是用于抽象
javascript数据类型。这个额外的层有一个好处,我们可以通过给它添加自定义的函数和属性来增强基础数据
的功能。比如添加数据的合法性验证、坚挺、数据持久化及服务器端的回调粗粒等,增加代码的重用率
原型继承:理解Object.create()
Object.create()只有一个参数,那就是原型对象(是一个对象),传入一个对象,返回一个继承这个对象的新对象。
看用法:
var User = function(){}; User.prototype.destory = function(){ console.log("destory"); }; var user = new User(); var newUser = Object.create(user); newUser.destory();//destory
仔细看chrome里面的对象属性
可以看到newUser对象的原型指向user的原型。
Object.create()是在ECMAScript5第五版规范才出现,所以在一些浏览器中并未实现,例如IE,
所以我们需要给这些浏览器打补丁
if(typeof Object.create !=='function'){ Object.create = function(parentObj){ var F = function(){}; F.prototype = parentObj; return new F(); }; }
再看这个例子:
var Model = { inherited:function(){}, created:function(){}, prototype:{ init:function(){} }, create:function(){ var object = Object.create(this); object.parent = this; object.prototype = object.fn = Object.create(this.prototype); object.create(); this.inherited(object); return object; }, init:function(){ var instance = Object.create(this.prototype); instance.parent = this; instance.init.apply(instance,arguments); return instance; } };
我们来做一下分析:
var Model = { inherited:function(){}, created:function(){}, prototype:{ init:function(){} }, create:function(){ //object的原型指向Model var object = Object.create(this); //object的parent属性指向this,即:Model对象 object.parent = this; //改写object的prototype,指向Model的prototype object.prototype = object.fn = Object.create(this.prototype); //var User = Model.create(); 返回object return object; }, init:function(){ //user 的原型指向User的原型 var instance = Object.create(this.prototype); //user的parent属性指向this,即调用init方法的User的this instance.parent = this; //instance 的init的作用域指向instance的实例 instance.init.apply(instance,arguments); //var user = User.init() return instance; } }; var User = Model.create(); var user = User.init(); user.created();
再看一下Model User user都具有哪些属性
然后我们还得给ORM添加属性,使用的是jQuery的extend方法
var Model = { inherited:function(){}, created:function(){}, prototype:{ init:function(){} }, create:function(){ //object的原型指向Model var object = Object.create(this); //object的parent属性指向this,即:Model对象 object.parent = this; //改写object的prototype,指向Model的prototype object.prototype = object.fn = Object.create(this.prototype); //var User = Model.create(); 返回object return object; }, init:function(){ //user 的原型指向User的原型 var instance = Object.create(this.prototype); //user的parent属性指向this,即调用init方法的User的this instance.parent = this; //instance 的init的作用域指向instance的实例 instance.init.apply(instance,arguments); //var user = User.init() return instance; }, extend: function(obj){ var extended = obj.extended; $.extend(this,obj); if(extended){ extended(this); } }, include:function(obj){ var included = obj.included; $.extend(this,obj); if(included){ included(this); } } }; Model.extend({ find:function(){ console.log("find"); }, extended:function(option){ console.log(option); } }); var User = Model.create(); var user = User.init();
$.extend(param1,param2,...);function的作用是把后面对象的属性加入到前面param1对象的属性里面。