前端 JS 设计模式之工厂模式、单例模式、适配器模式和装饰器模式

一、工厂模式

1. 工厂模式，将 new 操作单独封装。遇到 new 时，就要考虑是否该使用工厂模式。
2. 对于工厂模式的理解，可以举例。你去购买汉堡，直接点餐、取餐，不会自己亲手做。商店要封装做汉堡的工作，做好直接给买者。
3. 工厂模式的设计原则验证，构造函数和创建者分离，符合开放封闭原则。
4. 工厂模式的代码，如下所示：

class  Product {
    constructor(name) {
        this.name = name
    }
    init() {
        alert('init')
    }
    fun1() {
        alert('fun1')
    }
    fun2() {
        alert('fun3')
    }
}

class Creator {
    create(name) {
        return new Product(name)
    }
}

// 测试
let creator = new Creator()
let p = creator.create('p1')
p.init()
p.fun1()

二、单例模式

1. 单例模式，系统中被唯一使用，一个类只有一个实例。
2. 对于单例模式，常见的示例，比如登录框、购物车、vuex 和 redux 中的 store 等等。
3. 单例模式需要使用到 java 的特性 private。ES6 中没有，Typescript 除外，只能用 java 代码来演示 UML
   图的内容。
4. 单例模式的设计原则验证，符