<dfn id="w48us"></dfn><ul id="w48us"></ul>
  • <ul id="w48us"></ul>
  • <del id="w48us"></del>
    <ul id="w48us"></ul>
  • JavaScript 函數(shù)表達式

    時間:2024-06-28 07:22:11 JavaScript 我要投稿

    JavaScript 函數(shù)表達式

      JavaScript中創(chuàng)建函數(shù)主要有兩種方法:函數(shù)聲明和函數(shù)表達式。這兩種方式都有不同的適用場景。這篇筆記主要關注的是函數(shù)表達式的幾大特點以及它的使用場景,下面一一描述。

      主要特點

      可選的函數(shù)名稱

      函數(shù)名稱是函數(shù)聲明的必需組成部分,這個函數(shù)名稱相當于一個變量,新定義的函數(shù)會復制給這個變量,以后函數(shù)的調(diào)用都需要通過這個變量進行。而對于函數(shù)表達式來說,函數(shù)的名稱是可選的,例如下面的例子:

      var sub = function(a1,a2){ return a1-a2; }

      這個例子中函數(shù)表達式?jīng)]有名稱,屬于匿名函數(shù)表達式。再看下面的例子:

      var sub = function f(a1,a2){ return a1-a2; } console.log(f(5,3)); //錯誤調(diào)用方式 console.log(sub(5,3)); //正確調(diào)用方式

      在這個例子中,函數(shù)表達式的名稱為f,這個名稱f實際上變成了函數(shù)內(nèi)部的一個局部變量,并且指代函數(shù)對象本身,在函數(shù)遞歸的時候有很大用處,后面會詳細講到。

      在執(zhí)行階段創(chuàng)建(區(qū)別于函數(shù)聲明)

      這個特點是函數(shù)表達式明顯區(qū)別于函數(shù)聲明的地方。

      解釋器在解析JavaScript代碼時對于這兩種方式并不是一視同仁的。解釋器會首先讀取函數(shù)聲明,并使其在執(zhí)行任何代碼之前可用;而對于函數(shù)表達式,則必須等到解釋器執(zhí)行到它所在的代碼行,才會被真正解析執(zhí)行。例如:

      console.log(add(1,2)); //"3" console.log(sub(5,3)); //"unexpected identifier",報錯 function add(a1,a2){ return a1+a2; } var sub = function(a1,a2){ return a1-a2; }

      第一條語句完全可以正常執(zhí)行。對代碼求值時,JavaScript引擎在第一遍就會聲明函數(shù)并通過一個名為函數(shù)聲明提升的過程將它們放到源代碼樹的頂部。也就是說在執(zhí)行環(huán)境的創(chuàng)建階段(函數(shù)被調(diào)用但還沒有開始執(zhí)行)就會對函數(shù)聲明進行"hosting"操作。所以,即使聲明函數(shù)的代碼在調(diào)用它的代碼后面,JavaScript引擎也會把函數(shù)聲明提升到頂部。但是如果把函數(shù)聲明更改為函數(shù)表達式,就會在執(zhí)行期間報錯。原因在于在執(zhí)行到函數(shù)所在的語句之前,變量sub中并不會包含對函數(shù)的引用。也就是說在代碼執(zhí)行階段,變量sub才會被賦值。除了以上不同,在其它方面函數(shù)聲明和函數(shù)表達式的語法是等價的。

      不會影響變量對象

      var sub = function f(a1,a2){ console.log(typeof f); //"function" return a1-a2; } console.log(typeof f); //"Uncaught ReferenceError: f is not defined(…)"

      通過上面的例子可以看到,函數(shù)名稱f只能在函數(shù)對象內(nèi)部使用,函數(shù)表達式的函數(shù)名稱并不存在于變量對象中。

      使用場景

      函數(shù)表達式的使用場景很多。下面主要描述的是函數(shù)遞歸以及代碼模塊化方面的應用。

      函數(shù)遞歸

      看下面的例子:

      function factorial(num){ if(num <= 1){ return 1; }else{ return num * factorial(num - 1); } }

      這是一個經(jīng)典的階乘函數(shù),但是這個例子存在的一個問題是函數(shù)名稱factorial與函數(shù)體緊密耦合在一起,執(zhí)行下面的語句就會報錯:

      var anotherFactorial = factorial; factorial = null; console.log(anotherFactorial(5)); //"Uncaught TypeError: factorial is not a function"

      報錯的原因在于在函數(shù)體內(nèi)部會調(diào)用factorial函數(shù),而變量factorial對函數(shù)的引用已經(jīng)被解除所以報錯。這種情況的解決方法一般可以使用arguments.callee來解決,arguments.callee始終指向當前的函數(shù),例如:

      function factorial(num){ if(num <= 1){ return 1; }else{ return num * arguments.callee(num - 1); } }

      這樣在此執(zhí)行anotherFactorial函數(shù)就可以得到正確結果了。但是在嚴格模式"strict"下,arguments.callee是不能通過腳本訪問的,這是就可以使用函數(shù)表達式來解決這個問題了,例如:

      var factorial = (function f(num){ if(num <= 1){ return 1; }else{ return num * f(num - 1); } }); console.log(factorial(5)); //"120"

      代碼模塊化

      JavaScript中沒有塊級作用域,但我們可以使用函數(shù)表達式模塊化JavaScript代碼。模塊化代碼中可以封裝不必讓使用者知道的細節(jié),只暴露給使用者相關接口,同時可以避免對全局環(huán)境的污染,例如:

      var person = (function(){ var _name = ""; return{ getName:function(){ return _name; }, setName:function(newname){ _name = newname; } }; }()); person.setName("John"); person.getName(); //"John"

      這個例子中創(chuàng)建了一個匿名函數(shù)表達式,這個函數(shù)表達式中包含了模塊自身的私有變量和函數(shù);這個函數(shù)表達式的執(zhí)行結果返回一個對象,對象中包含了模塊暴露給使用者的公共接口。代碼模塊化的具體形式還有很多,例如在一些常用的JavaScript庫中通常都會使用類似下面例子的立即執(zhí)行函數(shù):

      (function(){ var _name = ""; var root = this; var person = { getName: function(){ return _name; }, setName: function(newname){ _name = newname; } }; root.person = person; }.call(this)); person.setName("John"); person.getName(); //"John"

      這種方式直接將包含模塊公共接口的對象作為全局對象的一個屬性,這樣在其它地方直接可以使用全局對象的這個屬性來使用這個模塊了。

    【JavaScript 函數(shù)表達式】相關文章:

    JavaScript基于正則表達式數(shù)字判斷函數(shù)06-14

    淺析jQuery 遍歷函數(shù)javascript08-06

    Javascript函數(shù)的定義和用法分析08-15

    JavaScript中push(),join() 函數(shù)實例詳解09-05

    最常用的20個javascript方法函數(shù)09-10

    JavaScript日期時間格式化函數(shù)08-29

    JavaScript中常見的字符串操作函數(shù)及用法07-24

    有關javascript實現(xiàn)的多個層切換效果通用函數(shù)示例10-07

    對javascript的理解08-08

    常用的JavaScript模式09-22

    主站蜘蛛池模板: 精品国产三级a∨在线| 99re6在线视频精品免费| 91精品国产91久久综合| 日韩精品一区二区午夜成人版| 精品无码国产自产拍在线观看蜜| 欧美精品区一级片免费播放| 亚洲AV无码之日韩精品| 亚洲电影日韩精品| 欲帝精品福利视频导航| 综合国产精品第一页| 国产精品女同久久久久电影院| 国产精品99久久久久久人| 99久久精品国产一区二区| 久久er国产精品免费观看8| 精品久久一区二区| 国产成人精品高清不卡在线 | 亚洲精品成人片在线观看精品字幕| 国产精品VA在线观看无码不卡| 蜜臀精品无码AV在线播放| 国产精品成人99久久久久91gav| 国产精品无码成人午夜电影| 亚洲av成人无码久久精品| 青青热久久国产久精品| 国产精品∧v在线观看| 3级黄性日本午夜精品| 久久久精品午夜免费不卡| 国产一精品一av一免费爽爽| 99在线精品一区二区三区| 精品福利视频一区二区三区 | 99精品久久精品一区二区| 2022国产精品不卡a| 91精品一区国产高清在线| 91探花福利精品国产自产在线 | 青草国产精品久久久久久| 亚洲国产精品无码久久| 亚洲av永久无码精品表情包| 亚洲精品A在线观看| 亚洲永久精品ww47| 日韩精品内射视频免费观看| 久久99国产精品尤物| 精品无码日韩一区二区三区不卡 |