前端常见的设计模式（TS和JS实现）——单例模式

单例模式可能是最著名的设计模式之一。它是一种创建模式，因为它确保无论我们尝试实例化一个类多少次，我们都只有一个可用的实例。

处理数据库连接之类的可以单例模式，因为我们希望一次只处理一个，而不必在每个用户请求时重新连接。

TS实现

class MyDBConn{
  protected static instance:MyDBConn | null = null
  private id:number = 0

  constructor(){
    this.id = Math.random()
  }

  public getID():number{
    return this.id
  }

  //-----------------核心代码-----------------------
  public static getInstance():MyDBConn{
    if(!MyDBConn.instance){
      MyDBConn.instance = new MyDBConn()
    }
    return MyDBConn.instance
  }
  //------------------------------------------------
}

//测试代码
const connections = [
  MyDBConn.getInstance(),
  MyDBConn.getInstance(),
  MyDBConn.getInstance(),
  MyDBConn.getInstance(),
  MyDBConn.getInstance(),
  MyDBConn.getInstance()
]

connections.forEach(c =>{
  console.log(c.getID())
})

//运行结果
0.8616514293905766
0.8616514293905766
0.8616514293905766
0.8616514293905766
0.8616514293905766
0.8616514293905766

JS实现

let MyDBConn = (function () {
    function MyDBConn() {
        this.id = 0;
        this.id = Math.random();
    }
    MyDBConn.prototype.getID = function () {
        return this.id;
    };
    //---------------------核心代码---------------
    MyDBConn.getInstance = function () {
        if (!MyDBConn.instance) {
            MyDBConn.instance = new MyDBConn();
        }
        return MyDBConn.instance;
    };
//------------------------------------------------
    MyDBConn.instance = null;
    return MyDBConn;
}());

//测试代码
let connections = [
    MyDBConn.getInstance(),
    MyDBConn.getInstance(),
    MyDBConn.getInstance(),
    MyDBConn.getInstance(),
    MyDBConn.getInstance(),
    MyDBConn.getInstance()
];
connections.forEach(function (c) {
    console.log(c.getID());
});

//运行结果
0.8616514293905766
0.8616514293905766
0.8616514293905766
0.8616514293905766
0.8616514293905766
0.8616514293905766
=================================================================
        // 单例模式
        // 1.需要把instance存储起来
        // 2.以闭包的形式实现
        // 3.可以使用new
        const Person = (function() {
            // 真构造函数体
            function Person(name, age) {
                this.name = name
                this.age = age
            }
            Person.prototype.sayHi = function() {
                    console.log('Hello World!')
                }
                //这个变量因为在一个不会销毁的函数（闭包）执行空间里面
                // 所以一直存在 
            let instance = null;
            // 全局变量接收的是这个函数
            return function(...arg) {
                if (!instance) instance = new Person(...arg)
                return instance
            }
        })()

        // 测试代码
        const p1 = new Person('bob', 18)
        const p2 = new Person()
        console.log(p1, p2)
        console.log(p1 === p2)
        p1.sayHi()
        // 运行结果
        {name: "bob", age: 18} {name: "bob", age: 18}
        true
        Hello World!