美文网首页
单例模式

单例模式

作者: Eason_0cce | 来源:发表于2019-08-07 22:12 被阅读0次

    Q:何为单例
    A:保证一个类仅有一个实例,并提供一个访问它的全局访问点

    给一个显式表达的例子

    //Singelation有个getinstance方法,调用一次此方法跟调用第二次得到相同的实例
    var Singelation = function(name){
        this.name = name;
        this.instance = null;
    }
    Singelation.getInstance = function(name){
        return this.instance || (this.instance = new Singelation(name))
    }
    var a = Singelation.getInstance("a");
    var b = Singelation.getInstance("b");
    console.log(a === b);
    

    普通的一个单例(闭包实现)

    var Singelation = (function(name){
        var instance = null;
        return {
            getInstance : function(){
                return instance || (instance = 1); //此处的1是假象的实例,我认为这个实例可以是任意值
            }
        } 
    })();
    var a = Singelation.getInstance();
    var b = Singelation.getInstance();
    console.log(a == b);
    

    用单例做个登录框,假设一个页面只有一个登录框

    var singelatonLogin = function(fn){
        var instance  = null;
        return function(){
            if(!instance){
                var div = document.createElement("div"); //假装这是一个登录框
                div.innerHTML = "登录框";
                document.body.prepend(div);
                instance = div;
            }
            return instance;
        }
    }
    var loginDiv = singelatonLogin();
    
    

    上面的例子是可以实现登录框的单例运用,但是我能不能把单例方法做成一个载体,供其他类似需求去用呢

    var singelaton = function(fn){
        var instance  = null;
        return function(){
            return instance || (instance = fn.apply(this, arguments))
        }
    }
    function loginDiv(html){
        var div = document.createElement("div"); //假装这是一个登录框
        div.style.display = 'none';
        document.body.prepend(div);
        return div;
    }
    //这里可以造一个登录框单例,同样可以造一个toast单例
    var loginSingelaton = singelaton(loginDiv);
    var loginDiv = loginSingelaton();
    

    畅想:程序设计模式不是目的,解决实际的工作需求才是最终方向,单例模式可以返回的实例类型可以很多,不要为了单例而单例,这过程中也可以做点别的。

    相关文章

      网友评论

          本文标题:单例模式

          本文链接:https://www.haomeiwen.com/subject/bkfzdctx.html