亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

<blockquote id="z2mjk"></blockquote>
<style id="z2mjk"><source id="z2mjk"><tr id="z2mjk"></tr></source></style>

    <ruby id="z2mjk"><menuitem id="z2mjk"><form id="z2mjk"></form></menuitem></ruby>
    1. javascript 單例模式詳解及簡單實例

       更新時間:2017年02月14日 15:47:15   投稿:lqh  
      這篇文章主要介紹了javascript 單例模式詳解及簡單實例的相關(guān)資料,需要的朋友可以參考下

      JS 單例模式

      概要:

      單例指一個類只有一個實例,這個類自行創(chuàng)建這個實例。

      利用對象字面量直接生成一個單例:

      var singleton = {
        prop: 1,
        method: function(){
          console.log(a);  //1
        }
      }
      

      嚴格的說對象字面量可能不算單例模式,生成單例是對象字面量的作用(已經(jīng)被封裝),而單例模式是一個設(shè)計模式(需要自行構(gòu)思或設(shè)計)。

      在類內(nèi)部用new生成實例的單例模式:

      var instance;
      var foo = function(){
        if(!instance){
          instance = new Singleton();
        }
        return instance;
        function Singleton(){
          this.name = 'single';
          this.method = function(){
            console.log(this.name);
          }
        };
      }
       
      var a = foo();
      var b = foo();
      a.method();       //single
      console.log(a === b);  //true
      

      單例模式只要檢測一個實例是否被生成。假如沒有實例,則生成實例。假如已經(jīng)生成則返回這個實例。保證這個類只有這一個實例。

      由于hoisting,函數(shù)會提前聲明,所以 singleton 函數(shù)放在哪都沒所謂,但是每次調(diào)用都會聲明函數(shù)singleton,可能會不夠優(yōu)雅。

      由于new關(guān)鍵字是執(zhí)行函數(shù),同時this指向這個對象,所以可以判斷類的this是否賦值給instance:

      var instance;
      var Singleton = function(){
        if(instance){
          return instance;
        }
        instance = this;
        this.name = 'single';
        this.method = function(){
          console.log(this.name);
        }
      }
       
      var a = new Singleton();
      var b = new Singleton();
      a.method();       //single
      console.log(a === b);  //true
      

      這個例子中,把instance指向了Singleton這個類,然后在類外部通過new來實例化,和上例中的new異曲同工。由于是通過修改this來達到檢測是否執(zhí)行過Singleton類,所以個人感覺不夠語義化。

       上面的例子用es6重構(gòu)的寫法。

      類內(nèi)部new生成單例:

      var instance;
      class foo{
        static Singleton(){
          if(!instance){
            instance = new foo();
          }
          return instance;
        }  
        method(){
          this.name = 'single';
          console.log(this.name);
        }
      }
       
      var a = foo.Singleton();
      var b = foo.Singleton();
      a.method();       //single
      console.log(a === b);  //true
      

      修改this指向生成單例:

      var instance;
      class foo{
        constructor(){
          if(!instance){
            this.Singleton();
          }
          return instance;
        }
        Singleton(){
          instance = this;
          this.name = 'single';
          this.method = function(){
            console.log(this.name);
          }
        }
      }
       
      var a = new foo();
      var b = new foo();
      a.method();       //single
      console.log(a === b);  //true
        
      

      當然除了這兩種以外還有別的方式能實例化一個單例。

      感謝閱讀,希望能幫助到大家,謝謝大家對本站的支持!

      相關(guān)文章

      • js+css實現(xiàn)三級導(dǎo)航菜單

        js+css實現(xiàn)三級導(dǎo)航菜單

        這篇文章主要為大家詳細介紹了js+css實現(xiàn)三級導(dǎo)航菜單,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
        2021-08-08
      • JavaScript中new操作符的原理示例詳解

        JavaScript中new操作符的原理示例詳解

        javascript中的new是一個語法糖,new的過程實際上是創(chuàng)建一個新對象,把新象的原型設(shè)置為構(gòu)造器函數(shù)的原型,這篇文章主要給大家介紹了關(guān)于JavaScript中new操作符原理的相關(guān)資料,需要的朋友可以參考下
        2021-07-07
      • Bootstrap響應(yīng)式側(cè)邊欄改進版

        Bootstrap響應(yīng)式側(cè)邊欄改進版

        這篇文章主要為大家詳細介紹了Bootstrap響應(yīng)式側(cè)邊欄改進版,結(jié)合導(dǎo)航條和下拉菜單進行改進,具有一定的參考價值,感興趣的小伙伴們可以參考一下
        2016-09-09
      • Echarts實現(xiàn)單條折線可拖拽效果

        Echarts實現(xiàn)單條折線可拖拽效果

        這篇文章主要為大家詳細介紹了Echarts實現(xiàn)單條折線可拖拽,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
        2019-12-12
      • 利用r.js打包模塊化的javascript文件方法示例

        利用r.js打包模塊化的javascript文件方法示例

        這篇文章主要給大家介紹了利用r.js打包模塊化的javascript文件的相關(guān)資料,文中介紹的非常詳細,對大家具有一定的參考學(xué)習(xí)價值,需要的朋友們下面來跟著小編一起看看吧。
        2017-06-06
      • 利用JavaScript實現(xiàn)繪制2023新年煙花的示例代碼

        利用JavaScript實現(xiàn)繪制2023新年煙花的示例代碼

        大家過年好!新春佳節(jié),在這個充滿喜悅的日子里,愿新年的鐘聲帶給你一份希望和期待。在這喜慶的日子里,小編和大家分享一個煙花代碼,希望大家能夠喜歡
        2023-01-01
      • 潛說js對象和數(shù)組

        潛說js對象和數(shù)組

        潛說js對象和數(shù)組 對象是一個無序?qū)傩约? 每個屬性都有自己的名字和值
        2011-05-05
      • js實現(xiàn)仿百度風(fēng)云榜可重復(fù)多次調(diào)用的TAB切換選項卡效果

        js實現(xiàn)仿百度風(fēng)云榜可重復(fù)多次調(diào)用的TAB切換選項卡效果

        這篇文章主要介紹了js實現(xiàn)仿百度風(fēng)云榜可重復(fù)多次調(diào)用的TAB切換選項卡效果,涉及javascript鼠標事件及頁面元素遍歷調(diào)用的實現(xiàn)技巧,非常簡單實用,需要的朋友可以參考下
        2015-08-08
      • 原生JS寫Ajax的請求函數(shù)功能

        原生JS寫Ajax的請求函數(shù)功能

        本文給大家分享一個自己寫的基于原生JS寫Ajax的請求函數(shù)功能,需要的朋友可以參考下
        2017-12-12
      • js多個物體運動功能實例分析

        js多個物體運動功能實例分析

        這篇文章主要介紹了js多個物體運動功能,結(jié)合實例形式分析了js實現(xiàn)多物體運動功能的原理、實現(xiàn)技巧與相關(guān)注意事項,需要的朋友可以參考下
        2016-12-12

      最新評論