单例模式

2017-03-22  本文已影响0人  yongningfu

单例模式

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)

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

上一篇 下一篇

猜你喜欢

热点阅读