JavaScript高级程序设计之设计模式

短命女 2022-05-25 03:47 212阅读 0赞

**工厂模式：**

此种模式是软件工程领域中的一个广为认知的设计模式，抽象了创建具体对象的过程，利用函数来封装以特定接口创建对象的细节。通过多次传参调用函数来创建具有多个属性和方法的对象。

1.优点：解决了创建多个相似对象的问题，操作简单

2.缺点：没有解决对象具体识别的问题，这是简单地识别为object类型，并没有具体化

例代码如下：

function createPerson(name,age,job){
            var o=new Object();
            o.name=name;
            o.age=age;
            o.job=job;
            o.sayName=function(){
                alert(this.name);
            };
            return o;
        }
        var person1=createPerson("mimi",18,"Software Engineer");
        var person2=createPerson("nene",28,"Doctor");

**构造函数：**

1.优点：可以创建特定类型的对象，没有显示创建对象，不用return返回值，操作简单方便，只要利用new操作符即可

2.缺点：每个方法都要在每一个实例上创建一遍，这样会导致当对象之间存在过多相同属性和方法时，存在大量的代码冗余。

例代码如下：

function createPerson(name,age,job){
            this.name=name;
            this.age=age;
            this.job=job;
            this.sayName=function(){
                alert(this.name);
            };
        }
        var person1=new Person("mimi",18,"Software Engineer");
        var person2=new Person("nene",28,"Doctor");

**原型模式：**

1.优点：此模式最大的优点就是完美解决了第二种模式中的缺点：可以让所有对象实例共享它包含的属性和方法，不必在构造函数中定义对象市里的信息，而是将这些信息直接添加到原型对象中

2.缺点：它的缺点正好也是由于它的优点导致的，它将所有信息都进行了共享，但实际上我们在开发过程，并不是希望所有信息都是共享的，有一部分共享，有一部分属于自己的独特的属性。

所以我们可以将第二种和第三种模式结合起来，解决此种问题，得到第四种设计模式。

function Person(){
            
        }
        Person.prototype.name="mimi";
        Person.prototype.age="15";
        Person.prototype.job="Doctor";
        Person.prototype.sayName=function(){
            alert(this.name);
        };
        var person1=new Person();
        person1.sayName();//mimi
        var person2=new Person();
        person2.sayName();//mimi

**组合使用构造函数模式和原型模式：**

每一个实例都会有自己的一份实例属性的副本，但同时又共享着对方法的引用，最大限度的节省了内存，此种模式还支持传递参数。所以此种模式也是ECMAScript使用最广泛、认同度最高的一种创建自定义类型的方法。

例如下代码：

//利用构造函数添加各自的属性，保持自己的独立性
        function Person(name,age,job){
            this.name=name;
            this.age=age;
            this.job=job;
            this.friends=["Shelby","Court"];
        }
    
        //利用原型共享彼此信息，保证信息共享
        Person.prototype={
            constructor:Person,
            sayName:function(){
                alert(this.name);
            }
        }
        var person1=new Person("Nicholas","29","Software Engineer");
        var person2=new Person("Greg","27","Doctor");
        person1.friends.push("Van");
        console.log(person1.friends);
        console.log(person2.friends);
        console.log(person1.sayName);
        console.log(person2.sayName);
        console.log(person1.friends === person2.friends);
        console.log(person1.sayName === person2.sayName);