美文网首页
单例模式

单例模式

作者: 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)

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

相关文章

  • 【设计模式】单例模式

    单例模式 常用单例模式: 懒汉单例模式: 静态内部类单例模式: Android Application 中使用单例模式:

  • Android设计模式总结

    单例模式:饿汉单例模式://饿汉单例模式 懒汉单例模式: Double CheckLock(DCL)实现单例 Bu...

  • 2018-04-08php实战设计模式

    一、单例模式 单例模式是最经典的设计模式之一,到底什么是单例?单例模式适用场景是什么?单例模式如何设计?php中单...

  • 设计模式之单例模式详解

    设计模式之单例模式详解 单例模式写法大全,也许有你不知道的写法 导航 引言 什么是单例? 单例模式作用 单例模式的...

  • Telegram开源项目之单例模式

    NotificationCenter的单例模式 NotificationCenter的单例模式分析 这种单例模式是...

  • 单例模式Java篇

    单例设计模式- 饿汉式 单例设计模式 - 懒汉式 单例设计模式 - 懒汉式 - 多线程并发 单例设计模式 - 懒汉...

  • IOS单例模式的底层原理

    单例介绍 本文源码下载地址 1.什么是单例 说到单例首先要提到单例模式,因为单例模式是单例存在的目的 单例模式是一...

  • 单例

    iOS单例模式iOS之单例模式初探iOS单例详解

  • 单例模式

    单例模式1 单例模式2

  • java的单例模式

    饿汉单例模式 懒汉单例模式

网友评论

      本文标题:单例模式

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