學(xué)習(xí)JavaScript設(shè)計(jì)模式之單例模式

更新時(shí)間：2016年01月19日 11:01:29 作者：奮飛

這篇文章主要為大家介紹了JavaScript設(shè)計(jì)模式中的單例模式，對(duì)JavaScript設(shè)計(jì)模式感興趣的小伙伴們可以參考一下

一、定義

保證一個(gè)類僅有一個(gè)實(shí)例，并提供一個(gè)訪問(wèn)它的全局訪問(wèn)點(diǎn)。
當(dāng)單擊登陸按鈕，頁(yè)面中出現(xiàn)一個(gè)登陸浮窗，這個(gè)登陸浮窗是唯一的，無(wú)論單擊多少次登陸按鈕，這個(gè)浮窗都只會(huì)被創(chuàng)建一次，那么這個(gè)登陸浮窗就適合用單例模式來(lái)創(chuàng)建。

二、實(shí)現(xiàn)原理

要實(shí)現(xiàn)單例并不復(fù)雜，使用一個(gè)變量來(lái)標(biāo)志當(dāng)前是否已經(jīng)為某個(gè)類創(chuàng)建過(guò)對(duì)象，如果是，則在下一次獲取該類的實(shí)例時(shí)，直接返回之前創(chuàng)建的對(duì)象。

三、假單例

全局變量不是單例模式，但在JavaScript開發(fā)中，我們經(jīng)常會(huì)把全局變量當(dāng)成單例來(lái)使用。

var a = {};

降低全局變量帶來(lái)的命名污染
（1）使用命名空間

var namespace1 = {
  a: function(){},
  b: 2
}

（2）使用閉包封裝私有變量

var user = (function() {
  var _name = 'lee',
    _age = '25';
  return {
    getUserInfo: function() {
      return _name + ":" + _age;
    }
  };
})();

四、惰性單例：在需要的時(shí)候才能創(chuàng)建對(duì)象實(shí)例

var getSingle = function(fn) {
  var result;
  return function() {
    return result || (result = fn.apply(this, arguments));
  };
};

// 測(cè)試
function testSingle(){}
getSingle(testSingle)() === getSingle(testSingle)();  // true

五、補(bǔ)充：

（1）懶加載

var lazyload = function() {
  console.log(1);
  lazyload = function() {
    console.log(2);
  }
  return lazyload();
}

lazyload();

（2）預(yù)加載

var preload = (function() {
  console.log(1);
  preload = function() {
    console.log(2);
  };
  return preload;
})();

preload();

希望本文所述對(duì)大家學(xué)習(xí)javascript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

JavaScript數(shù)組排序小程序?qū)崿F(xiàn)解析
這篇文章主要介紹了JavaScript數(shù)組排序小程序?qū)崿F(xiàn)解析,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2020-01-01
原生JavaScript實(shí)現(xiàn)隨機(jī)點(diǎn)名表
這篇文章主要為大家詳細(xì)介紹了原生JavaScript實(shí)現(xiàn)隨機(jī)點(diǎn)名表，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-01-01
JavaScript中的class類詳解
JavaScript?中的類（Class）是一種新的語(yǔ)言特性，它讓我們可以使用面向?qū)ο缶幊痰乃枷雭?lái)更加方便地組織和管理代碼。在本文中，我們將詳細(xì)介紹?JavaScript?中的類特性，感興趣的同學(xué)可以借鑒閱讀
2023-05-05
leaflet的開發(fā)入門教程
leaflet是領(lǐng)先的開源JavaScript庫(kù)為移動(dòng)設(shè)備設(shè)計(jì)的互動(dòng)地圖。接下來(lái)通過(guò)本文來(lái)給大家介紹下leaflet的開發(fā)入門教程，需要的朋友可以參考下
2016-11-11
js之如何篩選出兩個(gè)數(shù)組相同的值
這篇文章主要介紹了js之如何篩選出兩個(gè)數(shù)組相同的值問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-06-06
前端精度丟失問(wèn)題解決之后端Long類型到前端的處理策略
這篇文章主要介紹了前端精度丟失問(wèn)題解決之后端Long類型到前端的處理策略,在Web開發(fā)中前后端數(shù)據(jù)類型不匹配尤其是Long類型數(shù)據(jù)到前端可能導(dǎo)致精度丟失,文章探討了此問(wèn)題并提供三種解決方法,需要的朋友可以參考下
2024-09-09
解析javascript瀑布流原理實(shí)現(xiàn)圖片滾動(dòng)加載
這篇文章主要幫助大家解析javascript瀑布流原理，實(shí)現(xiàn)js圖片滾動(dòng)加載
2016-03-03
快速查找數(shù)組中的某個(gè)元素并返回下標(biāo)示例
最近在寫jquery的combobox插件時(shí)遇到效率問(wèn)題，再加上jquery選擇器的類帥選，導(dǎo)致效率很慢，采用以下方式二，可以輕松解決此問(wèn)題
2013-09-09
JavaScrip實(shí)現(xiàn)一個(gè)有時(shí)間限制的緩存類的方式
本文將探索 JavaScript 中一種基于自動(dòng)過(guò)期機(jī)制的時(shí)間限制緩存實(shí)現(xiàn)方式,提高數(shù)據(jù)緩存策略的靈活性和效率,文中通過(guò)代碼示例給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下
2024-01-01
情人節(jié)單身的我是如何在敲完代碼之后收到12束玫瑰的(javascript)
這篇文章主要介紹了情人節(jié)單身的我是如何在敲完代碼之后收到12束玫瑰的，感興趣的朋友一起來(lái)學(xué)習(xí)下
2015-08-08