JS设计模式之单例模式

含义

顾名思义,从字面上来看,单例也就是单一的意思,也可以理解为保证一个类仅有一个实例,并提供一个访问它的全局访问了点.

思路

新建对象时判断全局是否有该对象,如果有,就返回该对象,没有就创建一个新的实例并返回

js实现

• ES5实现

   var Single = (function() {
   var instance = null;
   function Single(name) {
       this.name = name;
   }
   return function(name){
       if (!instance) {
           instance = new Single(name);
       }
       return instance;
   };
   })();
   var oA = new Single('hi');
   var oB = new Single('hello');
   console.log(oA===oB);

解析:在第一次调用构造函数时,利用闭包存储了一个instance实例,以后的调用直接返回instance

• ES6实现

  class Singleton {
   constructor(name) {
       this.name = name;
       this.instance = null;
   }
   static getInstance(name) {
       if(!this.instance) {
           this.instance = new Singleton(name);
       }
       return this.instance;
   }
 }
 var oA = Singleton.getInstance('hi');
 var oB = Singleton.getInstance('hisd');
 console.log(oA===oB);

static关键字解释:类相当于实例的原型,所有在类中定义的方法,都会被实例继承,如果在一个方法前加上static关键字,就表示该方法不会被实例继承,而是直接通过类来调用,这就成为"静态方法"

• 单例模式的应用:全局中只需要一个公用的实例对象,比如:

  • 登录弹窗组件

  • 一个音乐播放程序，如果用户打开了一个音乐，又想打开一个音乐，那么之前的播放界面就会自动关闭，切换到当前的播放界面。这些都是单例模式的应用场景。

  • 任意一个网站，点击登录按钮，只会弹出有且仅有一个登录框，即使后面再点击登录按钮，也不会再弹出多一个弹框