JS设计模式之单例模式

关于单例模式相信大家都不会陌生，无非就是只能new一个对象，或者说new的多个对象都是相同的，接下来看下这段代码。

var obj=function(data){this.name=data.name;}
var obj1=new obj({name:"lin"});
var obj2=new obj({name:"xiao"});
console.log(obj1===obj2);

这段代码的输出结果，相信大家都知道是为false，因为他们是两个不同对象，指向的内存地址不一样。然后我们再看下这段代码

var ins=null;
    var obj=function(data){
        if(!ins){
            ins=obj;
            ins.name=data.name;
        }
        return ins;
    }
    var a=new obj({name:"lin"});
    var b=new obj({name:"xiao"});
    console.log(a===b);

这段代码的输出便为true了，这便是单例模式，但这样写其实并不是很好，因为ins被设置为全局变量，会污染全局，所以我们可以换种写法

var obj=(function(data){var ins=null;
return function(data){
if(!ins){ins=this;
ins.name=data.name;}
return ins;}})();

var obj1=new obj({name:"lin"})
var obj2=new obj({name:"xiao"});
console.log(obj1===obj2)

把ins写在函数自执行里面，这样便不会污染全局了。

这些都是es5的写法，下面我们来看下es6的写法。

首先重温下es6的普通写法

class obj{
constructor(data){
this.name=data.name;}
a(){}
};

var obj1=new obj({name:"a"});
var obj2=new obj({name:"b"});
console.log(obj1===obj2)

不用说，结果肯定为false，那么单例模式该怎么写呢

var obj=(function(){var ins=null;
return class{
constructor(data){
    if(!ins){
ins=this;
ins.name=data.name;}
return ins}
a(){}
}})();


var obj1=new obj({name:"a"});
var obj2=new obj({name:"b"});
console.log(obj1===obj2)

这样输出的结果就为true啦