zoukankan      html  css  js  c++  java
  • (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对象的属性里面。

  • 相关阅读:
    Vue介绍
    【Ribbon篇四】自定义负载均衡策略(4)
    【Eureka篇三】Eureka比Zookeeper好在哪里?(8)
    【Ribbon篇四】Ribbon核心组件IRule(3)
    【Eureka篇三】Eureka常用配置说明(7)
    【Eureka篇三】Eureka如何管理服务调用(6)
    【Ribbon篇四】Ribbon初步配置(2)
    【Ribbon篇四】Ribbon介绍(1)
    【Eureka篇三】Eureka集群配置(5)
    【Eureka篇三】Eureka服务发现(4)
  • 原文地址:https://www.cnblogs.com/lihaozhou/p/3982724.html
Copyright © 2011-2022 走看看