溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶(hù)服務(wù)條款》

JavaScript如何自定義函數(shù)

發(fā)布時(shí)間：2022-03-11 09:10:14 來(lái)源：億速云 閱讀：138 作者：iii 欄目：開(kāi)發(fā)技術(shù)

這篇文章主要介紹“JavaScript如何自定義函數(shù)”的相關(guān)知識(shí)，小編通過(guò)實(shí)際案例向大家展示操作過(guò)程，操作方法簡(jiǎn)單快捷，實(shí)用性強(qiáng)，希望這篇“JavaScript如何自定義函數(shù)”文章能幫助大家解決問(wèn)題。

JavaScript中的函數(shù)分為兩種：系統(tǒng)函數(shù)和自定義函數(shù)，這里主要講解自定義函數(shù)。

自定義函數(shù)

1、語(yǔ)法：

JavaScript如何自定義函數(shù)

注意：

  • 傳入的參數(shù)是可選的。

例如：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>自定義函數(shù)</title>
    <script>
        // 語(yǔ)法1自定義無(wú)參函數(shù)
       function custom(){
           document.write("自定義無(wú)參函數(shù)，使用第一種語(yǔ)法定義"+"<br />")
       };
       // 語(yǔ)法2
       var customer=function(){
        document.write("自定義無(wú)參函數(shù),使用第二種語(yǔ)法定義"+"<br />")
       };
       // 定義有參函數(shù)
       function customWithPara(i){
           document.write("自定義有參函數(shù)，使用第一種語(yǔ)法定義,i的值是:"+i+"<br />")
       };
       // 語(yǔ)法2
       var customerWithPara=function(i){
           document.write("自定義有參函數(shù),使用第二種語(yǔ)法定義,i的值是:"+i+"<br />")
       };
    </script>
</head>
<body>
    
</body>
</html>

2、函數(shù)的調(diào)用

函數(shù)可以通過(guò)函數(shù)名加上括號(hào)中的參數(shù)進(jìn)行調(diào)用。

例如：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>函數(shù)調(diào)用</title>
</head>
<body>
    <script>
       // 定義無(wú)參函數(shù)
       function custom(){
           document.write("這是無(wú)參的函數(shù)"+"<br />");
       };
       // 定義無(wú)參的函數(shù)變量
       var customer=function(){
        document.write("這是無(wú)參的函數(shù)變量"+"<br />");
       };
       // 定義有參函數(shù)
       function customWithPara(para){
           document.write("這是有參函數(shù)，參數(shù)值是:"+para+"<br />");
       }
       // 定義有參的函數(shù)變量
       var customerWithPara =function(para){
           document.write("這是有參的函數(shù)變量，參數(shù)值是:"+para+"<br />");
       }

       // 函數(shù)調(diào)用
       // 1、調(diào)用無(wú)參函數(shù)
       custom();
       // 2、調(diào)用有參函數(shù)
       customWithPara(45);
       // 無(wú)參函數(shù)變量的調(diào)用
       customer();
       // 有參函數(shù)變量的調(diào)用
       customerWithPara(23);
    </script>
</body>
</html>

結(jié)果：

JavaScript如何自定義函數(shù)

注意：

  • 調(diào)用函數(shù)時(shí)需要注意函數(shù)調(diào)用的順序。如果是自定義函數(shù)，那么也可以在函數(shù)定義之前調(diào)用函數(shù)，因?yàn)檫@時(shí)會(huì)自動(dòng)把函數(shù)的定義放到最前面。如果是通過(guò)變量的形式定義函數(shù)，那么必須先定義函數(shù)才能調(diào)用。

看下面的例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>函數(shù)調(diào)用</title>
</head>
<body>
    <script>
       // 函數(shù)調(diào)用
       // 1、調(diào)用無(wú)參函數(shù)
       custom();
       // 2、調(diào)用有參函數(shù)
       customWithPara(45);
       // 無(wú)參函數(shù)變量的調(diào)用
       customer();
       // 有參函數(shù)變量的調(diào)用
       customerWithPara(23);

       // 定義無(wú)參函數(shù)
       function custom(){
           document.write("這是無(wú)參的函數(shù)"+"<br />");
       };
       // 定義無(wú)參的函數(shù)變量
       var customer=function(){
        document.write("這是無(wú)參的函數(shù)變量"+"<br />");
       };
       // 定義有參函數(shù)
       function customWithPara(para){
           document.write("這是有參函數(shù)，參數(shù)值是:"+para+"<br />");
       }
       // 定義有參的函數(shù)變量
       var customerWithPara =function(para){
           document.write("這是有參的函數(shù)變量，參數(shù)值是:"+para+"<br />");
       }


    </script>
</body>
</html>

結(jié)果：

JavaScript如何自定義函數(shù)

3、匿名函數(shù)

匿名函數(shù)：顧名思義，即沒(méi)有函數(shù)名稱(chēng)的函數(shù)。其語(yǔ)法如下圖所示：

JavaScript如何自定義函數(shù)

例如：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>匿名函數(shù)</title>
</head>
<body>
    <script>
        // 傳統(tǒng)定義函數(shù)的方式
        function fn(){
            document.write("這是傳統(tǒng)函數(shù)的定義"+"<br />");
        };
        // 調(diào)用
        fn();
        // 匿名函數(shù)的定義和調(diào)用
        (function(){
            document.write("這是匿名函數(shù)"+"<br />");
        })();
    </script>
    
    
</body>
</html>

結(jié)果：

JavaScript如何自定義函數(shù)

4、匿名函數(shù)的應(yīng)用

匿名函數(shù)可以作為函數(shù)的參數(shù)進(jìn)行調(diào)用，看下面的例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>匿名函數(shù)的應(yīng)用</title>
    <script>
         // 匿名函數(shù)應(yīng)用
         function fun(para){
            document.write("參數(shù)的值是:"+para+"<br />");
        };
        // 用匿名函數(shù)作為函數(shù)的參數(shù)
        fun(function(){
            return 5;
        }());

        // 也可以使用下面的方式
        function fu(para){
            document.write("參數(shù)的值是:"+para()+"<br />");
        };
        fu(function(){
            return "56";
        });
    </script>
</head>
<body>
    
</body>
</html>

結(jié)果：

JavaScript如何自定義函數(shù)

關(guān)于“JavaScript如何自定義函數(shù)”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識(shí)，可以關(guān)注億速云行業(yè)資訊頻道，小編每天都會(huì)為大家更新不同的知識(shí)點(diǎn)。

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手