JS设计模式——外观模式

什么是外观模式

外观(Facade)模式是属于结构型模式,通过提供外观的包装隐藏系统的复杂性。

火箭发射系统很复杂,但真正使用它的人,可能就需要一个按钮,让它发射就好。那么发射按钮就隐藏了启动程序及发射系统的复杂性。

我们用的各种第三方库,大多也是通过给用户提供 API 来简化和隐藏内部的复杂实现。

实例

现在好多商店都在用微信或者支付宝扫码收款,如果放两个二维码经常会有顾客扫错,那么就可以应用外观模式,将不同的二维码整合成一个,通过系统内部区分。除此之外,我们还可以做额外的扩展。

class PayCode {
    constructor() {
        this.record = []
    }

    pay(args) {
       if(args.wechat) {
           this.record.push({
               type: 'wechat',
               amount: args.amount
           })
           console.log(`微信到账${args.amount}元`)
       }
       if(args.alipay) {
           this.record.push({
               type: 'alipay',
               amount: args.amount
           })
           console.log(`支付宝到账${args.amount}元`)
       }
    }

    getRecord() {
        console.log(this.record)
    }

    getSum() {
        const sum = this.record.reduce((total, item) => total + item.amount, 0)
        console.log(`账户总收入${sum}元`)
    }
    
}

// 使用
const paycode = new PayCode()

// 扫码记账
paycode.pay({wechat: true, amount: 10.5})

paycode.pay({alipay: true, amount: 8.5})

paycode.pay({alipay: true, amount: 2.2})

paycode.pay({wechat: true, amount: 1.5})

// 账本输出
paycode.getRecord()

// 计算总收入
paycode.getSum()

输出结果
在这里插入图片描述

优缺点

优点:隐藏了系统内部复杂的实现细节,提高了可用性和安全性。

缺点:对细节的抽象是以性能为代价的,毕竟直接扫码更快。大规模使用要考虑隐性成本。

在使用时,我们需要考虑利弊,把握抽象程度。

发布了63 篇原创文章 · 获赞 58 · 访问量 11万+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章