@TOC

外观模式

概念

为子系统中的一组接口提供了一个高层接口
使用者使用这个高层接口

外观模式（Facade）为子系统中的一组接口提供了一个一致的界面，此模块定义了一个高层接口，这个接口值得这一子系统更加容易使用。

在这里插入图片描述

如去医院看病，可能要去挂号、门诊、划价、取药，让患者或患者家属觉得很复杂，如果有提供接待人员，只让接待人员来处理，就很方便。

演示

外观模式比较简单，很容易理解。传统的 UML 图画法都是参照 java 语法以及 java 中面向对象设计的

在这里插入图片描述

在前端 JS 中，这种子类继承父类，且是多个子类继承一个父类的情况不多。因此这里看下这个图，理解之后就不再演示了。

场景

前端用外观模式思想，常见最多的就是函数参数的整合，例如

function bindEvent(elem, type, selector, fn) {
    if (fn == null) {
        fn = selector
        selector = null
    }

    // ******
}

// 调用
bindEvent(elem, 'click', '#div1', fn)
bindEvent(elem, 'click', fn)

在 jQuery 或者 lodash 中，有很多函数都这么设计。

总结

不符合单一职责原则和开放封闭原则，因此谨慎使用，不可滥用

（九）外观模式

外观模式

概念

演示

场景

总结