函數(shù) function

函數(shù)

JavaScript 有三種聲明函數(shù)的方法。

1、function 命令

  • function命令聲明的代碼區(qū)塊，就是一個(gè)函數(shù)。function命令后面是函數(shù)名，函數(shù)名后面是一對(duì)圓括號(hào)，里面是傳入函數(shù)的參數(shù)。函數(shù)體放在大括號(hào)里面
function print(s) {
  console.log(s);
}
  • 上面的代碼命名了一個(gè)print函數(shù)，以后使用print()這種形式，就可以調(diào)用相應(yīng)的代碼。這叫做函數(shù)的聲明（Function Declaration）

2、函數(shù)表達(dá)式

  • 除了用function命令聲明函數(shù)，還可以采用變量賦值的寫法
var print = function(s) {
  console.log(s);
};
  • 這種寫法將一個(gè)匿名函數(shù)賦值給變量。這時(shí)，這個(gè)匿名函數(shù)又稱函數(shù)表達(dá)式（Function Expression），因?yàn)橘x值語(yǔ)句的等號(hào)右側(cè)只能放表達(dá)式。
  • 采用函數(shù)表達(dá)式聲明函數(shù)時(shí)，function命令后面不帶有函數(shù)名。如果加上函數(shù)名，該函數(shù)名只在函數(shù)體內(nèi)部有效，在函數(shù)體外部無效。
var print = function x(){
  console.log(typeof x);
};

x
// ReferenceError: x is not defined

print()
// function
  • 上面代碼在函數(shù)表達(dá)式中，加入了函數(shù)名x。這個(gè)x只在函數(shù)體內(nèi)部可用，指代函數(shù)表達(dá)式本身，其他地方都不可用。這種寫法的用處有兩個(gè)，一是可以在函數(shù)體內(nèi)部調(diào)用自身，二是方便除錯(cuò)（除錯(cuò)工具顯示函數(shù)調(diào)用棧時(shí)，將顯示函數(shù)名，而不再顯示這里是一個(gè)匿名函數(shù)）。因此，下面的形式聲明函數(shù)也非常常見
var f = function f() {};
  • 需要注意的是，函數(shù)的表達(dá)式需要在語(yǔ)句的結(jié)尾加上分號(hào)，表示語(yǔ)句結(jié)束。而函數(shù)的聲明在結(jié)尾的大括號(hào)后面不用加分號(hào)?？偟膩碚f，這兩種聲明函數(shù)的方式，差別很細(xì)微，可以近似認(rèn)為是等價(jià)的

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

  • 第三種聲明函數(shù)的方式是Function構(gòu)造函數(shù)
var add = new Function(
  'x',
  'y',
  'return x + y'
);

// 等同于
function add(x, y) {
  return x + y;
}
  • 上面代碼中，F(xiàn)unction構(gòu)造函數(shù)接受三個(gè)參數(shù)，除了最后一個(gè)參數(shù)是add函數(shù)的“函數(shù)體”，其他參數(shù)都是add函數(shù)的參數(shù)
  • 你可以傳遞任意數(shù)量的參數(shù)給Function構(gòu)造函數(shù)，只有最后一個(gè)參數(shù)會(huì)被當(dāng)做函數(shù)體，如果只有一個(gè)參數(shù)，該參數(shù)就是函數(shù)體
var foo = new Function(
  'return "hello world"'
);

// 等同于
function foo() {
  return 'hello world';
}
  • Function構(gòu)造函數(shù)可以不使用new命令，返回結(jié)果完全一樣
  • 總的來說，這種聲明函數(shù)的方式非常不直觀，幾乎無人使用

常用定義函數(shù)

  • 在js中，使用函數(shù)前，必須使用function關(guān)鍵字來定義函數(shù)，函數(shù)常用方式有2種
  • 1、不指定函數(shù)名的函數(shù)
  • 2、指定函數(shù)名的函數(shù)

不指定函數(shù)名的函數(shù)

  • 函數(shù)，就是語(yǔ)句的集體，即語(yǔ)句塊
語(yǔ)法：
function(參數(shù)1,參數(shù)2,...參數(shù)n){
    //函數(shù)體語(yǔ)句
}
說明：
定義函數(shù)必須使用function關(guān)鍵字

指定函數(shù)名的函數(shù)

  • 指定函數(shù)名的函數(shù)是javascript中使用最廣泛的方法，反而“不指定函數(shù)名的函數(shù)”用的比較少
語(yǔ)法：
function 函數(shù)名(參數(shù)1,參數(shù)2,...參數(shù)n){
    //函數(shù)體語(yǔ)句
    return 表達(dá)式;
}
說明：
定義函數(shù)必須使用function關(guān)鍵字
函數(shù)名必須是衛(wèi)衣的，盡量通俗易懂，并且跟你定義的代碼有關(guān)
函數(shù)可以使用return語(yǔ)句將某個(gè)值返回，也可以沒有返回值
參數(shù)是可選的，可以不帶參數(shù)，也可以帶多個(gè)參數(shù)，吐過是多個(gè)參數(shù)的話，參數(shù)直接要用英文逗號(hào)隔開

舉例：

<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <script type="text/javascript">
        //定義函數(shù)
        function addNum(a,b)
        {
            var m=a+b;
            return m;
        }
        //調(diào)用函數(shù)
        var sum=addNum(1,2);
        document.write("相加的結(jié)果是："+sum);
    </script>
</head><body>
</body>
</html>
在瀏覽器預(yù)覽效果
  • 分析：
  • 我們?cè)诙x函數(shù)的時(shí)候用到的參數(shù)，那就叫“形參”，例如上面的a和b就是形參。我們?cè)谡{(diào)用函數(shù)時(shí)，與形參對(duì)應(yīng)的數(shù)據(jù)叫“實(shí)參?！逼鋵?shí)“形參”和“實(shí)參”從名字上面來看就很好理解，所謂的形參就是“形同虛設(shè)”而到頭來被其他數(shù)據(jù)替代掉的參數(shù)，實(shí)參就是實(shí)實(shí)在在的數(shù)據(jù)
  • 使用形參和實(shí)參，需要注意形參和實(shí)參是一一對(duì)應(yīng)的。通常，在定義函數(shù)時(shí)使用了多少形參，那么在函數(shù)調(diào)用時(shí)也必須給出多少個(gè)參數(shù)
  • 一句話：定義函數(shù)時(shí)的參數(shù)叫“形參”，調(diào)用函數(shù)時(shí)的參數(shù)叫“實(shí)參”

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

  • 如果一個(gè)函數(shù)僅僅是定義而沒有被調(diào)用的話，則函數(shù)本身是不會(huì)執(zhí)行的
  • 常用的函數(shù)調(diào)用方式有4種：
    （1）簡(jiǎn)單調(diào)用；
    （2）在表達(dá)式中調(diào)用；
    （3）在事件響應(yīng)中調(diào)用；
    （4）通過鏈接調(diào)用；
    一、簡(jiǎn)單調(diào)用
  • JS函數(shù)簡(jiǎn)單調(diào)用，也被稱為直接調(diào)用。該方法一般比較適用于沒有返回值的函數(shù)。也就是說相當(dāng)于執(zhí)行函數(shù)中的語(yǔ)句集合
語(yǔ)法：
函數(shù)名(實(shí)參1,實(shí)參2,….實(shí)參n);
  • 調(diào)用函數(shù)時(shí)的實(shí)參取決于定義函數(shù)時(shí)的形參
舉例：
<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <script type="text/javascript">
        //定義函數(shù)
        function alertSum()
        {
            //計(jì)算1+2+3+…+10的和
            var sum=0;
            for(var i=1;i<=10;i++)
            {
                sum=sum+i;
            }
        alert(sum);
        }
        //調(diào)用函數(shù)
        alertSum();
    </script>
</head>
<body>
</body>
</html>
在瀏覽器預(yù)覽效果

二、在表達(dá)式中調(diào)用

  • 在表達(dá)式中調(diào)用函數(shù)的方式，一般適用于有返回值的函數(shù)，然后函數(shù)的返回值參與表達(dá)式的計(jì)算。通常該方式還會(huì)和輸出語(yǔ)句（如document.write()、alert()等）搭配使用
舉例：判斷給定的年份是否閏年
<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <script type="text/javascript">
        //定義函數(shù)
        function isLeapYear(year)
        {
            //判斷閏年的條件
            if((year%4==0)&&(year%100!=0)||(year%400==0))
            {
                return year+"年是閏年";
            }
            else
            {
                return year+"年不是閏年";
            }
        }
        //調(diào)用函數(shù)
        document.write(isLeapYear(2015));
    </script>
</head>
<body>
</body>
</html>
在瀏覽器預(yù)覽效果

三、在事件響應(yīng)中調(diào)用

  • JavaScript是基于事件模型的程序語(yǔ)言，頁(yè)面加載、用戶點(diǎn)擊、移動(dòng)光標(biāo)等都會(huì)產(chǎn)生事件。當(dāng)事件產(chǎn)生時(shí)，JavaScript就可以調(diào)用某個(gè)函數(shù)來針對(duì)這個(gè)事件做出響應(yīng)
舉例：
<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <script type="text/javascript">
        function alertMes()
        {
            alert("老子果然最帥");
        }
    </script>
</head>
<body>
    <input type="button" onclick="alertMes()" value="提交"/>
</body>
</html>
在瀏覽器預(yù)覽效果

我們點(diǎn)擊按鈕就會(huì)彈出對(duì)話框，效果如下：


在瀏覽器預(yù)覽效果
  • 這就是所謂的在事件響應(yīng)中調(diào)用函數(shù)，這種方式非常實(shí)用
    四、通過鏈接調(diào)用
  • 函數(shù)除了可以在事件響應(yīng)中調(diào)用外，還可以通過超鏈接來調(diào)用函數(shù)
語(yǔ)法：
<a href="javascript:函數(shù)名"></a>
  • 說明：
  • 在超鏈接中調(diào)用函數(shù)，指的就是在a標(biāo)簽的href屬性中使用“javascript:函數(shù)名”來調(diào)用函數(shù)。當(dāng)用戶點(diǎn)擊該超鏈接時(shí)，就會(huì)執(zhí)行調(diào)用的相應(yīng)函數(shù)
舉例：
<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <script type="text/javascript">
        function mes()
        {
            alert("她：我愛helicopter。\n我：oh~my，= =?!");
        }
    </script>
</head>
<body>
    <a href="javascript:mes()">表白對(duì)話</a>
</body>
</html>
在瀏覽器中的效果
  • 當(dāng)我們點(diǎn)擊了超鏈接之后，就會(huì)調(diào)用函數(shù)mes()，效果如下：
    在瀏覽器中的效果
  • 分析：這里使用轉(zhuǎn)義字符“\n”來使得alert()函數(shù)的內(nèi)容換行
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容