创建对象模式

IMWeb前端团队

发布于 2017-12-29 16:23:25

7940

发布于 2017-12-29 16:23:25

文章被收录于专栏：IMWeb前端团队

创建自定义对象最简单的一个方式就是创建一个Object实例：

 //简单的创建对象方式 
        var person=new Object();
        person.name='Tom';
        person.output=function(){
            console.log('name:'+this.name);
        };

也可以使用对象字面量语法：

// 对象字面量
        var person={
            name:'Tom', 
            output:function(){
                console.log('name:' +this.name);
            }
        };

上述方式有明显的缺点：使用同一个接口创建很多对象，会产生大量重复代码。因此可以使用工厂模式：

// 工厂模式
       function createperson(){
           var person=new Object();
           person.name='Tom';
           person.output=function(){
               console.log('name:'+this.name);
           };
           return person;
       };
       var person1=createperson();
       person1.output();

用函数封装，可以无数次调用，但该方法没有解决对象识别问题，即则样知道一个对象的类型。我们可以使用构造函数模式：

// 构造函数模式
        function Person(name){
            this.name=name;
            this.output=function(){
                console.log('name:'+this.name);
            };
        };
        new Person('Tom').output();

使用构造函数也有缺点，那就是每个方法都要在每个实例上重新创建一遍。我们可以结合使用构造函数模式和原型模式：

// 构造函数模式+原型模式
        function Person(name) {
            this.name=name;
        };
        Person.prototype.output=function(){
            console.log('name:'+this.name);
        };
        new Person('Tom').output();

此外，还有一种动态原型模式，它将所有的信息封装在了函数内，必要时初始化原型：

// 原型模式
        function Person(name) {
            this.name=name;
            if(typeof this.output != 'function'){
                console.log(1);
                Person.prototype.output = function () {
                    console.log('name:' + this.name);
                };
            }
        }
        new Person('Tom').output();
        new Person('Jerry').output();

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

如有侵权请联系 cloudcommunity@tencent.com 删除

object