js--单例模式--补充案例--登录框

学习资源推荐

• 微信扫码关注公众号 ：前端前端大前端，追求更精致的阅读体验 ，一起来学习啊
• 关注后发送关键资料,免费获取一整套前端系统学习资料和老男孩python系列课程
  

学习资源推荐

demo

class LoginFrom {

    constructor() {
        this.instance = null;
        this.state = 'hide';
    }
    static getInstance() {

        if (!this.instance) {
            this.instance = new LoginFrom();
        }
        return this.instance;

    }

    show() {
        if (this.state === 'show') {
            alert('已经显示');
            return;
        }

        this.state = 'show';
        console.log('显示成功')

    }

    hide() {
        if (this.state === 'hide') {
            alert('已经隐藏');
            return;
        }
        this.state='hide'
        console.log('隐藏成功')
    }

}
const login1 = LoginFrom.getInstance();
const login2 = LoginFrom.getInstance();

login1.show();//默认隐藏，调用该方法，打印显示成功
login2.hide();//因为是单例，状态同步，上述方法调用后登录框为显示状态，调用hide方法，打印隐藏成功

console.log(login1 === login2)//true