JS 單例模式

姘存按發(fā)布于2019-08-22 11:18 / 1871人閱讀

摘要：但是如何在對(duì)構(gòu)造函數(shù)使用操作符創(chuàng)建多個(gè)對(duì)象的時(shí)候僅獲取一個(gè)單例對(duì)象呢。單例的實(shí)例引用單例構(gòu)造函數(shù)單例私有屬性和方法暴露出來(lái)的對(duì)象改進(jìn)之前在構(gòu)造函數(shù)中重寫(xiě)自身會(huì)丟失所有在初始定義和重定義之間添加到其中的屬性。

1. 單例模式

單例模式 (Singleton) 的實(shí)現(xiàn)在于保證一個(gè)特定類只有一個(gè)實(shí)例，第二次使用同一個(gè)類創(chuàng)建新對(duì)象的時(shí)候，應(yīng)該得到與第一次創(chuàng)建對(duì)象完全相同的對(duì)象。
當(dāng)創(chuàng)建一個(gè)新對(duì)象時(shí)，實(shí)際上沒(méi)有其他對(duì)象與其類似，因?yàn)樾聦?duì)象已經(jīng)是單例了 {a:1} === {a:1} // false 。

但是如何在對(duì)構(gòu)造函數(shù)使用 new 操作符創(chuàng)建多個(gè)對(duì)象的時(shí)候僅獲取一個(gè)單例對(duì)象呢。

2. 靜態(tài)屬性中的實(shí)例

在構(gòu)造函數(shù)的靜態(tài)屬性中緩存該實(shí)例，缺點(diǎn)在于 instance 屬性是公開(kāi)可訪問(wèn)的屬性，在外部代碼中可能會(huì)修改該屬性。

function Universe() {
    if (typeof Universe.instance === "object") {        // 判斷是否已經(jīng)有單例了
        return Universe.instance
    }
    Universe.instance = this
    return this
}
var uni1 = new Universe()
var uni2 = new Universe()
uni1 === uni2            // true

3. 閉包中的實(shí)例

可以把實(shí)例封裝在閉包中，這樣可以保證該實(shí)例的私有性并且保證該實(shí)例不會(huì)在構(gòu)造函數(shù)之外被修改，代價(jià)是帶來(lái)了額外的閉包開(kāi)銷。

function Universe() {
    var instance = this
    Universe = function() {    // 重寫(xiě)構(gòu)造函數(shù)
        return instance
    }
}
var uni1 = new Universe()
var uni2 = new Universe()
uni1 === uni2         // true

當(dāng)?shù)谝淮握{(diào)用構(gòu)造函數(shù)時(shí)，它正常返回 this ，然后在以后調(diào)用時(shí)，它將會(huì)執(zhí)行重寫(xiě)構(gòu)造函數(shù)，這個(gè)構(gòu)造函數(shù)通過(guò)閉包訪問(wèn)了私有 instance 變量，并且簡(jiǎn)單的返回了該 instance。

4. 惰性單例

有時(shí)候?qū)τ趩卫龑?duì)象需要延遲創(chuàng)建，所以在單例中還存在一種延遲創(chuàng)建的形式，也有人稱之為惰性創(chuàng)建。

const LazySingle = (function() {
  let _instance              // 單例的實(shí)例引用
 
  function Single() {        // 單例構(gòu)造函數(shù)
    const desc = "單例"        // 私有屬性和方法
    return {                   // 暴露出來(lái)的對(duì)象
      publicMethod: function() {console.log(desc)},
      publickProperty: "1.0"
    }
  }
  
  return function() {
    return _instance || (_instance = Single())
  }
})()

console.log(LazySingle()===lazySingle())        // true
console.log(LazySingle().publickProperty)       // 1.0

5. 改進(jìn)

之前在構(gòu)造函數(shù)中重寫(xiě)自身會(huì)丟失所有在初始定義和重定義之間添加到其中的屬性。在這種情況下，任何添加到 Universe() 的原型中的對(duì)象都不會(huì)存在指向由原始實(shí)現(xiàn)所創(chuàng)建實(shí)例的活動(dòng)鏈接：

function Universe() {
    var instance = this
    Universe = function() {
        return instance
    }
}
Universe.prototype.nothing = true
var uni1 = new Universe()
Universe.prototype.enthing = true
var uni2 = new Universe()
console.log(uni1 === uni2) // true

uni1.nothing // true
uni2.nothing // true
uni1.enthing // undefined
uni2.enthing // undefined
uni1.constructor.name // "Universe"
uni1.constructor === Universe // false

之所以 uni1.constructor 不再與 Universe() 相同，是因?yàn)閡ni1.constructor仍然指向原始的構(gòu)造函數(shù)，而不是重定義之后的那個(gè)構(gòu)造函數(shù)。
可以通過(guò)一些調(diào)整實(shí)現(xiàn)原型和構(gòu)造函數(shù)指針按照預(yù)期的那樣運(yùn)行：

function Universe() {
    var instance
    Universe = function Universe() {
        return instance
    }
    Universe.prototype = this // 保留原型屬性
    instance = new Universe()
    instance.constructor = Universe // 重置構(gòu)造函數(shù)指針
    instance.start_time = 0 // 一些屬性
    instance.big = "yeah"
    return instance
}
Universe.prototype.nothing = true
var uni1 = new Universe()
Universe.prototype.enthing = true
var uni2 = new Universe()
console.log(uni1 === uni2) // true

uni1.nothing & uni2.nothing & uni1.enthing & uni2.enthing // true
uni1.constructor.name // "Universe"
uni1.constructor === Universe // true
uni1.big    // "yeah"
uni2.big    // "yeah"

本文是系列文章，可以相互參考印證，共同進(jìn)步~

JS 抽象工廠模式
JS 工廠模式
JS 建造者模式
JS 原型模式
JS 單例模式
JS 回調(diào)模式
JS 外觀模式
JS 適配器模式
JS 利用高階函數(shù)實(shí)現(xiàn)函數(shù)緩存(備忘模式)
JS 狀態(tài)模式
JS 橋接模式
JS 觀察者模式

網(wǎng)上的帖子大多深淺不一，甚至有些前后矛盾，在下的文章都是學(xué)習(xí)過(guò)程中的總結(jié)，如果發(fā)現(xiàn)錯(cuò)誤，歡迎留言指出~

參考： 
《JavaScript模式》 P143
《Javascript 設(shè)計(jì)模式》 - 張榮銘
設(shè)計(jì)模式之單例模式

PS：歡迎大家關(guān)注我的公眾號(hào)【前端下午茶】，一起加油吧~

另外可以加入「前端下午茶交流群」微信群，長(zhǎng)按識(shí)別下面二維碼即可加我好友，備注加群，我拉你入群～

云服務(wù)器 GPU云服務(wù)器單例模式單例模式實(shí)現(xiàn) 單例模式總結(jié) pdo單例模式

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/92144.html

發(fā)表評(píng)論

登陸后可評(píng)論

0條評(píng)論

姘存按

男|高級(jí)講師

我要關(guān)注我要私信

TA的文章

tensorflow對(duì)應(yīng)版本

閱讀 2611·2023-04-25 17:33
Java--JDK7與JDK8的HashMap的區(qū)別

閱讀 680·2021-11-23 09:51
IMIDC日本多IP服務(wù)器$88/月起,E3-123x/16GB/512G SSD/30M帶寬

閱讀 2985·2021-07-30 15:32
前端部分知識(shí)總結(jié)

閱讀 1437·2019-08-29 18:40
CSS 邊框輪廓陰影

閱讀 1986·2019-08-28 18:19
node應(yīng)用遠(yuǎn)程調(diào)試教程

閱讀 1500·2019-08-26 13:48
SVG 立方體內(nèi)嵌路徑拼接

閱讀 2273·2019-08-23 16:48
自動(dòng)化測(cè)試(未完,后續(xù)學(xué)習(xí)之后會(huì)補(bǔ)充更具體的)

閱讀 2307·2019-08-23 15:56

成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

JS 單例模式

相關(guān)文章

淺談js單例模式

js設(shè)計(jì)模式--單例模式

js常用設(shè)計(jì)模式實(shí)現(xiàn)（一）單例模式

從ES6重新認(rèn)識(shí)JavaScript設(shè)計(jì)模式(一): 單例模式

發(fā)表評(píng)論

0條評(píng)論

姘存按

男|高級(jí)講師

TA的文章

tensorflow對(duì)應(yīng)版本

Java--JDK7與JDK8的HashMap的區(qū)別

IMIDC日本多IP服務(wù)器$88/月起,E3-123x/16GB/512G SSD/30M帶寬

前端部分知識(shí)總結(jié)

CSS 邊框輪廓陰影

node應(yīng)用遠(yuǎn)程調(diào)試教程

SVG 立方體內(nèi)嵌路徑拼接

自動(dòng)化測(cè)試(未完,后續(xù)學(xué)習(xí)之后會(huì)補(bǔ)充更具體的)

最新活動(dòng)

資訊專欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

JS 單例模式

相關(guān)文章

發(fā)表評(píng)論

0條評(píng)論

男|高級(jí)講師

TA的文章

最新活動(dòng)

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！