站長資訊網(wǎng)
        最全最豐富的資訊網(wǎng)站

        深入解析JS自定義函數(shù)的聲明和調(diào)用

        函數(shù)是一組執(zhí)行特定任務(具有特定功能)的,可以重復使用的代碼塊。除了使用內(nèi)置函數(shù)外,我們也可以自行創(chuàng)建函數(shù)(自定義函數(shù)),然后在需要的地方調(diào)用這個函數(shù),這樣不僅可以避免編寫重復的代碼,還有利于代碼的后期維護。

        深入解析JS自定義函數(shù)的聲明和調(diào)用

        一:聲明函數(shù)的幾種方法

        JavaScript中自定義函數(shù)的聲明方法有 3 種,即使用 function 語句、使用 Function() 構(gòu)造函數(shù)和定義函數(shù)直接量。

        1、function 語句

        在 JavaScript 中可以使用 function 語句聲明函數(shù)。具體用法如下:

        function funName([args]) {     statements }

        funName 是函數(shù)名,與變量名一樣必須是 JavaScript 合法的標識符。在函數(shù)名之后是一個由一個小括號包含的參數(shù)列表,參數(shù)之間以逗號分隔。參數(shù)是可選的,沒有數(shù)量限制。

        作為標識符,參數(shù)僅在函數(shù)體內(nèi)被訪問,參數(shù)是函數(shù)作用域的私有成員。調(diào)用函數(shù)時,通過為函數(shù)傳遞值,然后使用參數(shù)獲取外部傳入的值,并在函數(shù)體內(nèi)干預函數(shù)的運行。

        在小括號之后是一個大括號,大括號內(nèi)包含的語句就是函數(shù)體結(jié)構(gòu)的主要內(nèi)容。在函數(shù)體重,大括號是必不可少的,缺少大括號,JavaScript 將會拋出語法錯誤。

        示例

        function 語句必須包含函數(shù)名、小括號和大括號,其他代碼都可省略,因此最簡單的函數(shù)體是一個空函數(shù)。

        function funName() {}  //空函數(shù)

        如果使用匿名函數(shù),則可以省略函數(shù)名。

        function () {}  //匿名空函數(shù)

        var 語句和 function 語句都是聲明語句,它們聲明的變量和函數(shù)都在 JavaScript 預編譯時被解析,也被稱為變量提升和函數(shù)提升。在預編譯期,JavaScript 引擎會為每個 function 創(chuàng)建上下文,定義變量對象,同時把函數(shù)內(nèi)所有形參、私有變量、嵌套函數(shù)作為屬性注冊到變量對象上。

        2、Function() 構(gòu)造函數(shù)

        使用 Function() 構(gòu)造函數(shù)可以快速生成函數(shù)。具體用法如下:

        var funName = new Function(p1, p2, ..., pn, body);

        Function() 的參數(shù)類型都是字符串,p1~pn 表示所創(chuàng)建函數(shù)的參數(shù)名稱列表,body 表示所創(chuàng)建函數(shù)的函數(shù)結(jié)構(gòu)體語句,在 body 語句之間以分號分隔。

        示例1

        可以省略所有參數(shù),僅傳遞一個字符串,用來表示函數(shù)體。

        var f = new Function ("a", "b", "return a+b");  //通過構(gòu)造函數(shù)來克隆函數(shù)結(jié)構(gòu)

        在上面代碼中,f 就是所創(chuàng)建函數(shù)的名稱。同樣是定義函數(shù),使用 function 語句可以設計相同結(jié)構(gòu)的函數(shù)。

        function f(a, b) {  //使用function語句定義函數(shù)結(jié)構(gòu)     return a + b; }

        示例2

        使用 Function() 構(gòu)造函數(shù)可以不指定任何參數(shù),創(chuàng)建一個空函數(shù)結(jié)構(gòu)體。

        var f = new Function();  //定義空函數(shù)

        使用 Function() 構(gòu)造函數(shù)可以動態(tài)的創(chuàng)建函數(shù),它不會把用戶限制在 function 語句預聲明的函數(shù)體中。使用 Function() 構(gòu)造函數(shù)能夠把函數(shù)當做表達式來使用,而不是當做一個結(jié)構(gòu),因此使用起來會更靈活。其缺點就是,F(xiàn)unction() 構(gòu)造函數(shù)在執(zhí)行期被編譯,執(zhí)行效率非常低,一般不推薦使用。

        3、匿名函數(shù)(函數(shù)直接量)

        函數(shù)直接量也稱為匿名函數(shù),即函數(shù)沒有函數(shù)名,僅包含 function 關(guān)鍵字、參數(shù)和函數(shù)體。具體用法如下:

        function ([args]) {     statements }

        示例1

        下面代碼定義一個函數(shù)直接量。

        function (a, b) {  //函數(shù)直接量     return a + b; }

        在上面代碼中,函數(shù)直接量與使用 function 語句定義函數(shù)結(jié)構(gòu)基本相同,它們的結(jié)構(gòu)都是固定的。但是函數(shù)直接量沒有指定函數(shù)名,而是直接利用關(guān)鍵字 function 來表示函數(shù)的結(jié)構(gòu),這種函數(shù)也被稱為匿名函數(shù)。

        示例2

        匿名函數(shù)就是一個表達式,即函數(shù)表達式,而不是函數(shù)結(jié)構(gòu)的語句。下面把匿名函數(shù)作為一個值賦值給變量 f。

        //把函數(shù)作為一個值直接賦值給變量 f var f = function (a, b) {     return a + b; };

        當把函數(shù)結(jié)構(gòu)作為一個值賦值給變量之后,變量就可以作為函數(shù)被調(diào)用,此時變量就指向那個匿名函數(shù)。

        console.log(f(1,2));  //返回值3

        深入解析JS自定義函數(shù)的聲明和調(diào)用

        示例3

        匿名函數(shù)作為值,可以參與更復雜的表達式運算。針對上面示例可以使用以下代碼完成函數(shù)定義和調(diào)用一體化操作。

        console.log(  //把函數(shù)作為一個操作數(shù)進行調(diào)用     (function (a,b) {         return a + b;     })(1, 2));  //返回數(shù)值3

        深入解析JS自定義函數(shù)的聲明和調(diào)用

        二:調(diào)用函數(shù)

        一旦定義好了一個函數(shù),我們就可以在當前文檔的任意位置來調(diào)用它。調(diào)用函數(shù)非常簡單,只需要函數(shù)名后面加上一個括號即可,例如 alert()、write()。注意,如果在定義函數(shù)時函數(shù)名后面的括號中指定了參數(shù),那么在調(diào)用函數(shù)時也需要在括號中提供對應的參數(shù)。

        示例代碼如下:

        function sayHello(name){     document.write("Hello " + name); } // 調(diào)用 sayHello() 函數(shù) sayHello('PHP中文網(wǎng)');

        深入解析JS自定義函數(shù)的聲明和調(diào)用

        提示:JavaScript 對于大小寫敏感,所以在定義函數(shù)時 function 關(guān)鍵字一定要使用小寫,而且調(diào)用函數(shù)時必須使用與聲明時相同的大小寫來調(diào)用函數(shù)。

        贊(0)
        分享到: 更多 (0)
        網(wǎng)站地圖   滬ICP備18035694號-2    滬公網(wǎng)安備31011702889846號
        主站蜘蛛池模板: 国产精品欧美亚洲韩国日本不卡| 国产精品成人69XXX免费视频| 99久久精品国产一区二区蜜芽| 久久久精品人妻一区二区三区四| 精品91自产拍在线观看二区| 久久er国产精品免费观看2| 亚洲精品国产av成拍色拍| 国产三级国产精品国产普男人| 国产精品久久久久9999高清| 久久精品九九亚洲精品| 中文字幕日本精品一区二区三区| 国产午夜福利精品久久| 91久久精品无码一区二区毛片| 国产精品99久久久久久人| 国产精品兄妹在线观看麻豆| 无码人妻精品一区二区三18禁| 四虎精品成人免费视频| 久久精品这里只有精99品| 国产亚洲精品成人a v小说| 亚洲国产精品久久| 欧美精品亚洲精品日韩专区va| 国产精品福利一区二区久久| 99热门精品一区二区三区无码| 精品一区二区三区无码免费视频| 网友偷拍日韩精品 | 亚洲AV无码成人精品区在线观看| 麻豆国产高清精品国在线| 精品久久人人爽天天玩人人妻| 国产精品va久久久久久久| 国产精品白丝jkav网站| 国产精品亚洲αv天堂无码| 国内精品久久久久久久影视麻豆 | 国产原创精品视频| 久久精品国产91久久综合麻豆自制| 精品国产乱码一区二区三区| 国内精品九九久久久精品| 8x福利精品第一导航| 精品久久777| 国产精品内射久久久久欢欢 | 欧美成人精品欧美一级乱黄一区二区精品在线 | 亚洲国产精品一区二区成人片国内|