欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

《javascript設(shè)計模式》學(xué)習(xí)筆記三:Javascript面向?qū)ο蟪绦蛟O(shè)計單例模式原理與實現(xiàn)方法分析

 更新時間:2020年04月07日 11:28:10   作者:silentime  
這篇文章主要介紹了Javascript面向?qū)ο蟪绦蛟O(shè)計單例模式原理與實現(xiàn)方法,結(jié)合實例形式分析了《javascript設(shè)計模式》中Javascript面向?qū)ο髥卫J较嚓P(guān)概念、原理、用法及操作注意事項,需要的朋友可以參考下

本文實例講述了Javascript面向?qū)ο蟪绦蛟O(shè)計單例模式原理與實現(xiàn)方法。分享給大家供大家參考,具體如下:

1.單例模式概述

源自百度百科對于單例模式的定義:

單例模式的意思就是只有一個實例。單例模式確保某一個類只有一個實例,而且自行實例化并向整個系統(tǒng)提供這個實例。這個類稱為單例類。

在javascript的世界里,其實沒有嚴(yán)格的對象和類定義,“一切皆對象”使得javascript中都是對象,不能像java,c++或者php使用特定的方法返回一個實例來實現(xiàn),因此對javascript來說,我們要創(chuàng)造的是一個“不能被多次實例化的”對象,也就是說只能實例化一次的對象。

2.簡單單例模式:

只能實例化一次的對象也就可以使用“對象字面量”的定義方式來實現(xiàn):

var singleton = {
  attribute:'',
  method:function(){}
}

這樣定義的對象,不能使用new singleton的方式來生成另外的對象(不存在prototype和constructor屬性)。

3.包含私有成員的單例模式:

如果看過之前的我寫的關(guān)于類成員的文章,自然的我們就能想到用閉包來實現(xiàn),既然要用的閉包,那么一定會用到函數(shù)和函數(shù)返回值,于是,這樣的單例模式如下:

var singleton = function(){
  var private_attribute = '';
  functioin private_method(){}
  return {
   public_attribute:'',
   public_method:function(){}
  };
}

還記得匿名函數(shù)嗎?通常在使用閉包的時候會使用,改進(jìn)之后如下:

var singleton = (function(){
  var private_attribute = '';
  functioin private_method(){}
  return {
   public_attribute:'',
   public_method:function(){}
  };
})();

4.惰性加載(lazy loading,延遲加載)單例模式

2,3中所示單例模式定義方式都是在定義時創(chuàng)建的單例,這樣很浪費(fèi)內(nèi)存,如何能在使用的時候才創(chuàng)建(lazy loading,更多的用于圖片的延遲加載)呢?所謂惰性加載,也就是先定義,然后在某個地方才創(chuàng)建對象,所以必須要使用函數(shù),我們知道在java或者php中單例模式通常使用一個靜態(tài)方法來創(chuàng)建,同理,我們再改進(jìn)一下閉包形式的定義式:

var singleton = (function(){
  var unique;
  function getinstance(){
    if(!unique){
      unique = construct();
      return unique;
    }
  }
  function construct(){
    var private_member;
    function private_method(){}
    return {//這里才是真正的單例對象
      public_member:'',
      public_method:function(){}
    };
})();

這樣調(diào)用一個單例對象的方法:

singleton.getinstance().publicmethod();

這樣只有在調(diào)用方法或引用屬性的時候才會真正的創(chuàng)建unique對象,就是使用的時候比較麻煩:)

5.簡單mvc代碼風(fēng)格

順便在這里分享一下我寫js的一個簡單風(fēng)格,盡管js是一個前臺代碼,但是就其本身而言,也可以將它的內(nèi)容分為mvc(model,controller,view,關(guān)于mvc的概念請baidu/google),因此在寫一個頁面的js代碼的時候,我會這么寫:

//函數(shù)封裝在此
var controller = {
  init:function(){}
};
//頁面相關(guān)內(nèi)容封裝在此
var view = {
  table:{},
  banner:{},
  foot:{}
};
//數(shù)據(jù)相關(guān)內(nèi)容封裝在此
var model = {
  table_data:{}
}

在頁面onload的時候調(diào)用controoler.init();完成初始化工作(數(shù)據(jù)加載,頁面渲染,事件監(jiān)聽等),這樣寫的目的是盡量將一些相同的邏輯組織在一起,方便查找和修改,目前只是一個雛形,希望在看完《javascript設(shè)計模式》這本書之后能寫一個輕量級的模型出來^_^

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具http://tools.jb51.net/code/HtmlJsRun測試上述代碼運(yùn)行效果。

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《javascript面向?qū)ο笕腴T教程》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)

希望本文所述對大家JavaScript程序設(shè)計有所幫助。

相關(guān)文章

  • JavaScript的原型繼承詳解

    JavaScript的原型繼承詳解

    這篇文章主要詳細(xì)介紹了JavaScript的原型繼承的相關(guān)資料,十分詳細(xì),需要的朋友可以參考下
    2015-02-02
  • Boostrap中柵格布局的實現(xiàn)

    Boostrap中柵格布局的實現(xiàn)

    這篇文章主要為大家詳細(xì)解析了Boostrap 柵格布局,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2017-01-01
  • js仿支付寶多方框輸入支付密碼效果

    js仿支付寶多方框輸入支付密碼效果

    這篇文章主要為大家詳細(xì)介紹了js仿支付寶多方框輸入支付密碼效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2016-09-09
  • Chrome調(diào)試折騰記之JS斷點(diǎn)調(diào)試技巧

    Chrome調(diào)試折騰記之JS斷點(diǎn)調(diào)試技巧

    這篇文章主要介紹了Chrome調(diào)試折騰記之JS斷點(diǎn)調(diào)試技巧,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-09-09
  • 關(guān)于JS判斷圖片是否加載完成且獲取圖片寬度的方法

    關(guān)于JS判斷圖片是否加載完成且獲取圖片寬度的方法

    本篇文章小編為大家介紹,關(guān)于JS判斷圖片是否加載完成且獲取圖片寬度的方法,有需要的朋友可以參考一下
    2013-04-04
  • Google (Local) Search API的簡單使用介紹

    Google (Local) Search API的簡單使用介紹

    這篇文章主要介紹了Google (Local) Search API的簡單使用。需要的朋友可以過來參考下,希望對大家有所幫助
    2013-11-11
  • 基于Javascript實現(xiàn)彈出頁面效果

    基于Javascript實現(xiàn)彈出頁面效果

    彈出層效果是一個很實用的功能,很多網(wǎng)站都采用了這種方式實現(xiàn)登錄和注冊,下面小編通過本文給大家分享具體實現(xiàn)代碼,對js彈出頁面效果相關(guān)知識感興趣的朋友一起學(xué)習(xí)吧
    2016-01-01
  • 純JavaScript 實現(xiàn)flappy bird小游戲?qū)嵗a

    純JavaScript 實現(xiàn)flappy bird小游戲?qū)嵗a

    這篇文章主要介紹了純JavaScript 實現(xiàn)flappy bird小游戲?qū)嵗a,b本文分七大步驟給大家介紹,非常不錯,具有參考借鑒價值,需要的朋友可以參考下
    2016-09-09
  • JavaScript隨機(jī)生成顏色的方法

    JavaScript隨機(jī)生成顏色的方法

    這篇文章主要介紹了JavaScript隨機(jī)生成顏色的方法的相關(guān)資料,非常不錯,代碼簡單易懂,具有參考借鑒價值,需要的朋友可以參考下
    2016-10-10
  • 原生JavaScript實現(xiàn)換膚

    原生JavaScript實現(xiàn)換膚

    這篇文章主要為大家詳細(xì)介紹了原生JavaScript實現(xiàn)換膚,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2021-02-02

最新評論