JavaScript设计模式

2021-12-10 21:52:17

一、设计模式

　设计模式是一套被反复使用，思想成熟，经过分类和无数实战设计经验的总结。

　　使用设计模式是为了让系统代码可重用，可扩展，可解耦，更容易被人理解且能保证代码可靠性。

　　设计模式使代码开发真正工程化；设计模式是软件工程的基石脉络，如同大厦的结构一样。

　　只有夯实地基搭好结构，才能盖出坚壮的大楼。也是我们迈向高级开发人员必经的一步。

二、单例模式

　　单例就是保证一个类只有一个实例，实现的方法一般是先判断实例存在与否，如果存在则直接返回，如果不存在就创建了再返回，这就确保了一个类只有一个实例对象。
　　在JavaScript中，单例作为一个命名空间提供者，从全局命名空间里提供一个唯一的访问点来访问该对象。

var single = (function() {
    var unique;
    function getInstance() {
        if (unique === undefined) {
            unique = new Construct();
        }
        return unique;
    }
    function Construct() {
        // ... 生成单例的构造函数的代码
    }
    return {
        getInstance: getInstance
    }

})();

三、构造函数模式

　　构造函数用于创建特定类型的对象。不仅声明了使用的对象，构造函数还可以接收参数以便第一次创建对象的时候设置对象的成员值。可以自定义构造函数，然后在里面声明自定义类型对象的属性和方法。

　　在JavaScript里，构造函数通常是认为用来实现实例的，JavaScript没有类的概念，但是有特殊的构造函数。

　　通过new关键字来调用自定义的构造函数，在构造函数内部，this关键字引用的是新创建的对象。

function Car(model, year, miles) {
    this.model = model;
    this.year = year;
    this.miles = miles;
    this.output= function () {
        return this.model + "走了" + this.miles + "公里";
    };
}

var tom= new Car("大叔", 2009, 20000);
var dudu= new Car("Dudu", 2010, 5000);

console.log(tom.output());
console.log(dudu.output());

四、工厂模式

　　工厂模式定义了一个用于创建对象的接口，这个接口决定了实例化哪一个类。

　　该模式使一个类的实例化延迟到了子类。而子类可以重写接口方法以便创建的时候指定自己的对象类型（抽象工厂），（简单工厂：能找到具体细节）；抽象工厂只留口，不做事，留给外界覆盖；
　　这个模式十分有用，尤其是创建对象的流程赋值的时候，比如依赖于很多设置文件等。并且，会经常在程序里看到工厂方法，用于让子类定义需要创建的对象类型。
　　简单工厂模式：使用一个类（通常为单体）来生成实例。
　　复杂工厂模式：使用子类来决定一个成员变量应该是哪个具体的类的实例。

　　简单工厂模式代码如下：

var BicycleFactory = {
    createBicycle : function( model ){
        var bicycle;
        switch( model ){
            case "The Speedster":
                bicycle = new Speedster();
                break;
            case "The Lowrider":
                bicycle = new Lowrider();
                break;
            case "The Cruiser":
            default:
                bicycle = new Cruiser();
                break;
        }
        return bycicle;
    }
}

　　BicycleFactory 是一个脱离于BicycleShop的单体。降低耦合度的效果显而易见。

　当需要添加新的类型的时候，不需要动 BicycleShop ，只需修改工厂单体对象就可以。代码如下所示：

var BicycleShop = function(){};

BicycleShop.prototype = {
    sellBicycle : function( model ){
        var bicycle = BicycleFactory.createBicycle(model);     
        return bicycle;
    }
}

　　复杂工厂模式与简单工厂模式相比，主要区别就是它不是另外使用一个对象或者类来创建实例（自行车），而是使用一个子类。

　　工厂是一个将其成员对象的实例化推迟到子类中进行的类。

　　比如加入BicycleShop可以决定从那一家厂商进行进货，那么简单的一个BicycleFactory是不够了的，因为各个厂商会各自生产不同的Speedster，Lowrider，Cruiser等型号自行车，所以首先需要生成各自厂商的shop实例，不同厂商的shop实例拥有不同的生成几个型号自行车的方法。

　　也就是相当于将自行车对象的实例化推迟到了shop实例中产生。

　　基础代码如下：

var BicycleShop = function(){}
BicycleShop.prototype={
    sellBicycle: function( model ){
        var bicycle = this.createBicycle( model );
        return bicycle;
    },
    createBicycle: function( model ){
        throw new Error( " Unsupported " );
    }
}

　　各自厂商代码如下：

var AcmeBicycleShop = function(){};

extend( AcmeBicycleShop , BicycleShop );
AcmeBicycleShop.prototype.createBicycle = function( model ){
    var bicycle;
    switch( model ){
        case "The Speedster":
            bicycle = new AcmeSpeedster();
            break;
        case "The Lowrider":
            bicycle = new AcmeLowrider();
            break;
        case "The Cruiser":
        default:
            bicycle = new AcmeCruiser();
            break;
    }
    return bicycle;
}

var GeneralBicycleShop = function(){};

extend( GeneralBicycleShop , BicycleShop );
GeneralBicycleShop.prototype.createBicycle = function( model ){
   ...
}

　　对于来自 Acme 进货代码如下：

var acmeShop = new AcmeBicycleShop();
var newBicycle = acmeShop.sellBicycle("The Speedster");

　　你也可以对于外层生成的子类实例在使用简单工厂模式进行包装一下~对于添加其他厂商也很简单，在创建一个Bicycle的子类重新定义其createBicycle的工厂方法即可。

　　工厂模式使用场合：

　　1.动态实现

　　例如自行车的例子，创建一些用不同方式实现统一接口的对象，那么可以使用一个工厂方法或者简单工厂对象来简化实现过程。选择可以是明确进行的也可以是隐含的。

　　2.节省设置开销

　　如果对象要进行复杂的并且彼此相关的设置的时候，那么工厂模式可以很显著的减少每种对象的代码量。将特定的设置代码提取出来会使得代码有极大地提升。并且能优化结构便于维护。

　　3.用于许多小型对象组成一个大对象。

　　工厂模式好处：可以消除对象间的耦合，通过使用工程方法而不是new关键字。将所有实例化的代码集中在一个位子防止代码重复。

　　工厂模式坏处：多数类最好使用new关键字和构造函数，可以让代码更加简单易读。

码农公寓

相关文章