浅谈js中es5(闭包)--es6类分别实现单例的思想

先说单例—es5实现单例—（闭包）

es5的单例—由于没有类的概念–我们走闭包实现单例的职责和实现思路，因为闭包可以记录变量。

使用场景	登录弹窗–或者一些全局的提示
理由	弹窗的触发是多次的，但是弹窗的代码只需初次点击后生成一次就可，后续触发弹窗事件。只需拿到上次生成的dom就行，无需再次生成，造成资源浪费。当然在我们一次未点击的时候，弹窗代码也无需生成

上代码：

//生成登录框的单例
    var getSingle = function (fn) {
        var result;
        return function () {
            return result || (result = fn.apply(this,arguments));
            //主要这里进行判断--第一次进来没有result就会执行||方法获取到div
            //该方法是个闭包  此时外层的变量result就被赋值了  下次再触发登录事件时--这里取的result就是上次生成的DOM->div
            //实现了单例模式的概念
        }
    }
    //创建登录框
    var createLoginLayer = function () {
        var div = document.createElement('div');
        div.innerHTML = '我是登录弹窗';
        div.style.display = 'none';
        document.body.appendChild(div);
        return div;
    }
    var createSingleLogin = getSingle(createLoginLayer);
    document.getElementById('button').onclick=function () {
        var loginLayer = createSingleLogin();
        loginLayer.style.display = 'block';
    }

es6的单例(class类)

由于在es6中引入了类的概念，我们js终于也感受到了是在面向对象开发，下面用class类来实现单例的概念。
思路很简单–直接上代码。

  class Person{
        constructor(name,age) {
            this.name = name;
            this.age = age;
        }
        static getSingle(name,age){
            //是个静态方法--只能被类访问--不能被实例访问--用来解决单例问题
            if(!this.isInstance){//先判断有没有这个数据--因为第一次进来肯定没有--所以取反进去--创建个实例，然后inInstance就有值了--以后进来返回的都是第一次创建的实例的值
                this.isInstance = new Person(name,age);
            }
            return this.isInstance;
        }
    }
    let person1 = Person.getSingle('小吴','18');
    let person2 = Person.getSingle('小xie','68');//这里得到的还是上次创建的实例
    console.log(person1)//---{name:小吴,age:18}
    console.log(person2)//---{name:小吴,age:18}

上面两个样例就简单实现了js中es5和es6中单例的概念，代码块中的注释很详细，es5的单例代码用到了闭包。小白看不懂的可以留言