JS设计模式之单例模式

单例模式的应用场景有很多， 比如 我们常用的 jquery， 就是采取的单例模式。 双十一我们必须用到的购物车， 也是单例模式， 那我们今天用一个登录的实例，来揭开单例模式的神秘面纱。

1. 首先建立一个登录表单的类

    class LoginForm {
   constructor() {
       this.state = 'hide'
   }
   
   show() {
       if (this.state === 'show') {
           alert('显示页面')
           return
       }
       this.state = 'show'
       console.log('登录框已经显示')
   }
   
   hide() {
       if (this.state === 'hide') {
           alert('已经隐藏')
           return
       }
       this.state = 'hide'
       console.log('登录框已经隐藏')
    }
   }
   

2. 我们使用原生的js闭包来创建一个返回实例的函数：

     LoginForm.getInstance = (function() {
   let instance;
   if (!instance) {
       instance = new LoginForm()
   }
   return instance
    })()
   
   

3. 最后调用这个函数

    let login1 = LoginForm.getInstance()
    login1.show()
   
   
   let login2 = LoginForm.getInstance()
   login2.show()
   
   alert(login1===login2)
   
   

4. 最后一行代码的结果留给大家去实践啦， 验证一下你的猜想