JavaScript形而上的单例模式

什么是单例模式?

单例模式是指,类多次实例化返回的对象是同一个。

反例

var tt = function(name){
    this.name = name;
};

var t1 = new tt('t1');
var t2 = new tt('t2');

console.log('t1和t2',t1 === t2);
// => t1和t2 false

上面的代码,t1和t2就不是同一个对象。
同样的实例化方法,我们怎么让t1和t2是同一个对象?

手动创建单例函数

请看如下代码。

var tt = function(name){
    this.name = name;
};

var ttSingleHandle = (function () {
    var instance;
    var singleFn = function(name){
        if (!instance) {
            instance = new tt(name);
        }
        return instance;
    }
    singleFn.prototype.construtor = tt;
    return singleFn;
})();

var t1 = new tt('t1');
var t2 = new tt('t2');

var t5 = new ttSingleHandle('t5');
var t6 = new ttSingleHandle('t6');

console.log('t1和t2',t1 === t2);
console.log('t5和t6',t5 === t6);
// => t1和t2 false
// => t5和t6 true

这里t5和t6是同一个对象。
然而每次手动创建对应的单例函数效率不高,我们可以改造成单例工程函数。

单例工厂函数

var tt = function(name){
    this.name = name;
};

var singleFactory = function (fn) {
    var instance;
    var singleFn = function () {
        if(instance !== undefined){
            return instance;
        }
        else{
            var temp = fn.bind(this, ...arguments);
            instance = new temp();
            return instance;
        }        
    };
    singleFn.prototype.construtor = fn;
    return singleFn;
};

var t1 = new tt('t1');
var t2 = new tt('t2');

var ttSingle = singleFactory(tt);
var t3 = new ttSingle('t3');
var t4 = new ttSingle('t4');

console.log('t1和t2',t1 === t2);
console.log('t3和t4',t3 === t4);
// => t1和t2 false
// => t3和t4 true

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 s1 = Singleton.getInstance('s1');
var s2 = Singleton.getInstance('s2');
console.log(s1 === s2);
// => true

因为截止2018年6月22日,ES6类不支持静态属性,只支持静态函数。
静态属性的支持还在ES7提案中。
假设支持静态属性,那么写法如下。

class Singleton {
    static instance = null

    constructor(name) {
        if (!Singleton.instance) {
            this.name = name;
            instance = this;
        }
        return Singleton.instance;
    }
}

var s1 = new Singleton('s1');
var s2 = new Singleton('s2');
console.log(s1 === s2);
// => true
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值