设计模式之-单例模式

1.创建一个单例类

javascript 复制代码

class Singleton {
    constructor(name){
        this.name=name;
    }
    static instance = null;
    getName(){
        console.log(this.name);
    }
    static getInstance(name){
        if(!Singleton.instance){
            Singleton.instance = new Singleton(name);
        }
        return Singleton.instance;
    }
}
const a = Singleton.getInstance('a');
const b=Singleton.getInstance('b');
console.log(a===b) // true

2.我们通过Singleton.getInstance来获取Singleton类的唯一对象，这种方式相对简单，但有一个问题，就是增加了这个类的'不透明性'，Singleton类的使用者必须知道这是一个单例类，跟以往通过new的方式不同，这里便要用Singleton.getInstance来获取对象。

3.透明的单例模式

javascript 复制代码

 		class CreateDiv{
            static instance=null;
            constructor(html){
                if(CreateDiv.instance){
                    return CreateDiv.instance;
                }
                this.html=html;
                this.init();
                return CreateDiv.instance=this;
            }
            init(){
                const div=document.createElement('div');
                div.innerHTML=this.html;
                document.body.appendChild(div);
            }
        }

        const aa=new CreateDiv('aa');
        const bb=new CreateDiv('bb');
        console.log(aa===bb) // true

4.虽然现在完成了一个透明的单例类的编写，但是他同样又一些缺点，在这段代码中，CreateDiv的构造器实际上负责了两件事情。一个是创建对象和执行初始化函数，第二个是保证只有一个对象，这是违反"单一职责原则的"，将来如果我们需要利用这个累，在页面上创建千千万万个div，即要让这个类从单例类变成一个普通的可以产生多个实例的类，那么我们必须改写CreateDiv这个类，把控制创建为宜对象的那一段去掉，这种修改会给我们带来不必要的烦恼

5.用代理实现单例模式

javascript 复制代码

		class CreateDiv{
            static instance=null;
            constructor(html){
                this.html=html;
                this.init();
            }
            init(){
                const div=document.createElement('div');
                div.innerHTML=this.html;
                document.body.appendChild(div);
            }
        }

        class ProxySingletonCreateDiv {
            static instance=null;
            constructor(html){
                if(!ProxySingletonCreateDiv.instance){
                    ProxySingletonCreateDiv.instance = new CreateDiv(html)
                }
                return ProxySingletonCreateDiv.instance;
            }
        }
        const aa=new ProxySingletonCreateDiv('aa');
        const bb=new ProxySingletonCreateDiv('bb');
        console.log(aa===bb) // true

6.通过引入代理类的方式，我们同样完成了一个单例模式的编写，跟之前不同的是，现在我们把负责管理单例的逻辑转移到了代理类ProxySingletonCreateDiv中，这样一来，CreateDiv就变成了一个普通的类，他跟ProxySingletonCreateDiv组合起来就可以达到单例类的效果，这个例子也是缓存代理的应用之一