前端设计模式之建造者模式

189 阅读3分钟

建造者模式

如果静下心来,闭上眼睛去用心感受感受我们生活的这个世界,就会发现世界上的任何伟大的事物,都是一些微小的事物组成,或许这其中还有你曾今不以为然的存在。正如古语有云:不积跬步,无以至千里

解释: 将一个复杂事物的构造与其表现分离,将其内部的每一部分都拆成一个类似的小的结构部分,最终通过组合的形式构建出一个完整的事物

优点:

  1. 各个建造者以及其子结构相互独立,能够灵活使用
  2. 方便整体结构(或者说系统结构)的扩展以卸载
  3. 整体结构不需要关心其内部的子结构的细节

缺点(相对的来讲):

  1. 一改多改, 因建造者模式其本质是将多个不同小对象组合起来达到最终目的,故而提高了小对象的复用性,当一个小对象被多处复用以后,再去针对特定的需求改动其内部实现时,就可能造成联动效应。

与工厂模式对比

  1. 不难发现建造者模式中,最终的结果是通过组装每一个零部件实现的,而工厂模式相对来说比较注重零部件的创建过程
  2. 举个例子:
    大学的时候,刚刚学习计算机,非常想有一台自己组装的电脑玩耍,不但能装13,还比买整机相对便宜,最舒服的是玩起游戏来爽呀!!!今天我们就用这个例子来剖析一下。

  1. 需求: 显示器、机箱、主板、cpu、显卡、硬盘、固态、内存条、电源

  2. 玩起来吧:

从目的出发,我们的最终目标是要一台可以运行的台式电脑,而达成此目的,我们只需要将各个部件组合起来就好,电源、内存条、cpu、显示器、硬盘、主板通过连线组装起来,便能够开机了。至于一台电源、cpu等它内部怎么去实现的,我们也就不需要去关心了(如果你是牛人,自己造一个cpu替换了原来的cpu当然也是可以的,而其中替换的代价也是非常小的)。

作为一台游戏机,上面的这中配置怎么能满足我们的要求呢?显然不能,接下来我们来给他搞牛气一点,加个固态、加个显卡、换个cpu、加个内存条等等操作,然而这些操作,我们只需要对标主板标准,或换、或增。分分钟搞定。

  1. 抽象:

如果我们将上述电脑看成我们需求当中最终要实现的对象,主板看成提供的链接接口,那么电源、内存条等部件都将是一个一个小的对象部分,而我们只需要将这些小对象组合起来变达到我们的目的了。至于这当中的每一个小对象怎么来的,你可以自己实现、也可以去借用他人的。

  1. 代码实现:
    function Computer({ cpu, gpu, disk, power, displaydevice, ram }) {
        if (!cpu || !disk || !power || !displaydevice || !ram){
            console.log('这个电脑没法玩')
            throw new Error("缺少cpu、硬盘、电源、显示器或者内存条的电脑没法玩")
        }
        this.cpu = cpu
        this.disk = disk
        this.power = power
        this.displaydevice = displaydevice
        this.ram = ram
        this.gpu = gpu || '先使用集成显卡吧'
    }
    // 内存条
    function RAM() {
        this.type = 'ram'
    }
    // 硬盘
    function Disk() {
        this.type = 'disk'
    }
    // cpu
    function CPU() {
        this.type = 'cpu'
    }
    // 显卡
    function GPU() {
        this.type = 'gpu'
    }
    // 电源
    function Power() {
        this.type = 'power'
    }
    // 显示器
    function DisplayDevice() {
        this.type = 'displaydevice'
    }
    
    var computer = new Computer({ 
        cpu: new CPU(),
        disk: new Disk(),
        power: new Power(),
        displaydevice: new DisplayDevice(),
        ram: new RAM()
    })
    console.log(computer)
    

上面的代码非常简单,但是可以看出建造者模式非常的灵活,如果我需要换任意一个部件,我们只需要换一下对应的小对象就好了,而对于顶级对象而言,小对象如何实现我们并不关心(虽然有时候要自己去实现),我只需要拿到其结果便可。

github地址: github.com/ypf0088/blo…