美文网首页
单例模式

单例模式

作者: yongningfu | 来源:发表于2017-03-22 15:40 被阅读0次

    单例模式

    js中单例模式的实现非常多,原理都是建立一个闭包,然后保存之前创建的对象,如果对象存在的话,就直接把存在的对象返回去,不存在的话,创建一个对象返回
    下面是一个通用用的单例模式,包含了思想有 懒性加载 职则分离 闭包*

    /** */
    
    var getSingle = function(fn) {
      var result;
      return function() {
        //这种写法的话 要求fn必须要有一个返回值
        return result || (result = fn.apply(this, arguments))
      }
    }
    
    //返回一个modal对象 要求全局中 只能有唯一一个全局Modal对象 所以使用单例
    const createModal = function(html) {
      var div = document.createElement('div');
      div.innerHTML = html;
      document.body.appendChild(div);
      div.style.display = 'none';
      return div;
    }
    
    //创建一个闭包
    var Modal = getSingle(createModal);
    var m1 =  Modal('这是一个Modal');
    var m2 = new Modal('这也是一个Modal');
    
    console.log(m1 === m2);
    

    对于有些用户只能想让这个函数只能执行一次的情况,而不想函数有返回值,我们改一下getSingle,

    推荐的单例模式写法

    var getSingle = function(fn) {
      var result; //如果函数没有返回结果的话 执行了一次后 默认设置为true
      return function() {
                                   //如果fn无返回结果 那么result 设置为true
        return result || (result = (fn.apply(this, arguments) || true));
      }
    }
    
    //我们想让这个函数 只能执行一次
    const handlerOnce = function() {
        console.log('handler once');
    }
    
    //创建一个闭包 这里使用 new handler 或者不要new handler均可 new handler的话
    //创建this对象 不用的话 this指定window对象, 不过在严格模式下 this执行window对象会报错,所以函数里面使用了this的话  还需new 一下
    var handler = getSingle(handlerOnce);
    var r1 = handler(); //handler once
    var r2 = handler(); //无输出  这说明只是执行了一次
    console.log(r1, r1 === r2)
    

    其他情况的话 比较简单,就不多说了

    相关文章

      网友评论

          本文标题:单例模式

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