JavaScript函數(shù)的使用詳解
1. 聲明函數(shù)
//聲明函數(shù)
function 函數(shù)名() {
//函數(shù)體代碼
}
function是聲明函數(shù)的關(guān)鍵字，必須小寫由于函數(shù)一般是為了實(shí)現(xiàn)某個(gè)功能才定義的，所以通常我們將函數(shù)名命名為動(dòng)詞，比如getSum
2. 調(diào)用函數(shù)
//調(diào)用函數(shù) 函數(shù)名(); //通過調(diào)用函數(shù)名來執(zhí)行函數(shù)體代碼
聲明函數(shù)本身并不會(huì)執(zhí)行的代碼，只有調(diào)用函數(shù)時(shí)才會(huì)執(zhí)行函數(shù)體代碼。
3. 函數(shù)的參數(shù)
在聲明函數(shù)時(shí)，可以在函數(shù)名稱后面的小括號(hào)中添加一些參數(shù)，這些參數(shù)被稱為形參，而在調(diào)用該函數(shù)時(shí)，同樣也需要傳遞相應(yīng)的參數(shù)，這些參數(shù)被稱為實(shí)參。
| 參數(shù) | 說明 |
|---|---|
| 形參 | 形式上的參數(shù) 函數(shù)定義的時(shí)候 傳遞的參數(shù) 當(dāng)前并不知道是什么 |
| 實(shí)參 | 實(shí)際上的參數(shù) 函數(shù)調(diào)用的時(shí)候傳遞的參數(shù) 實(shí)參是傳遞給形參的 |
參數(shù)的作用：在函數(shù)的內(nèi)部某些值不能固定，我們可以通過參數(shù)在調(diào)用函數(shù)時(shí)傳遞不同的值進(jìn)去。
函數(shù)形參和實(shí)參個(gè)數(shù)不匹配問題
| 參數(shù)個(gè)數(shù) | 說明 |
|---|---|
| 實(shí)參個(gè)數(shù)等于形參個(gè)數(shù) | 輸出正確結(jié)果 |
| 實(shí)參個(gè)數(shù)多于形參個(gè)數(shù) | 只取到形參的個(gè)數(shù) |
| 實(shí)參個(gè)數(shù)少于形參個(gè)數(shù) | 多的形參定義為undefined，結(jié)果為NaN |
function sum(num1,num2) {
console.log(num1+num2);
}
sum(100,200); //實(shí)參個(gè)數(shù)等于形參個(gè)數(shù) 輸出正確結(jié)果
sum(100,400,500,700); //實(shí)參個(gè)數(shù)多于形參個(gè)數(shù) 只取到形參的個(gè)數(shù)
sum(200); //實(shí)參個(gè)數(shù)少于形參個(gè)數(shù) 多的形參定義為undefined，結(jié)果為NaN
在JavaScript中，形參的默認(rèn)值是undefined 。
4. 函數(shù)的返回值
經(jīng)常用return返回函數(shù)值
return終止函數(shù)
function add(num1,num2) {
//函數(shù)體
return num1+num2; //注意：return后的代碼不執(zhí)行
alert('前面有return，我不會(huì)被執(zhí)行');
}
var resNum = add(21,6); //調(diào)用函數(shù)，傳入兩個(gè)實(shí)參，并通過resNum接收函數(shù)返回值
alert(resNum); //27
如果函數(shù)有return，則返回return后面的值；如果沒有return，則返回 undefined 。
break，continue，return的區(qū)別
break：結(jié)束當(dāng)前的循環(huán)體(如for、while)continue：跳出本次循環(huán)，繼續(xù)執(zhí)行下次循環(huán)(如for、while)return：不僅可以退出循環(huán)，還能夠返回return語句中的值，同時(shí)還可以結(jié)束當(dāng)前的函數(shù)體內(nèi)的代碼。
5. arguments的使用
當(dāng)我們不確定有多少個(gè)參數(shù)傳遞的時(shí)候，可以用arguments來獲取，在JavaScript中，arguments實(shí)際上它是當(dāng)前函數(shù)的一個(gè)內(nèi)置對(duì)象。所有函數(shù)都內(nèi)置了一個(gè)arguments對(duì)象，arguments對(duì)象中存儲(chǔ)了傳遞的所有實(shí)參。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
function fn() {
console.log(arguments); //里面存儲(chǔ)了所有傳遞過來的實(shí)參
console.log(arguments.length);
console.log(arguments[2]);
//可以按照數(shù)組的方式遍歷arguments
for (var i = 0; i < arguments.length; i++) {
console.log(arguments[i]);
}
}
fn(1, 2, 3);
fn(1, 2, 3, 4, 5);
//偽數(shù)組 并不是真正意義上的數(shù)組
//1. 具有數(shù)組的length 屬性
//2. 按照索引的方式進(jìn)行存儲(chǔ)的
//3. 它沒有真正數(shù)組的一些方法 如pop() push()等等
</script>
</head>
<body>
</body>
</html>
6. 函數(shù)可以調(diào)用另外一個(gè)函數(shù)
function fn1() {
console.log(111);
fn2();
console.log('fn1');
}
function fn2() {
console.log(222);
console.log('fn2');
}
fn1();
7. 函數(shù)的兩種聲明方式
//1. 利用函數(shù)關(guān)鍵字自定義函數(shù)(命名函數(shù))
function fn() {
}
fn();
//2. 函數(shù)表達(dá)式(匿名函數(shù))
//var 變量名 = function() {};
var fun = function(aru) {
console.log('我是函數(shù)表達(dá)式');
console.log(aru);
}
fun('FG'）；
//(1) fun是變量名 不是函數(shù)名
//(2) 函數(shù)表達(dá)式聲明方式跟聲明變量差不多，只不過變量里面存的是值 而函數(shù)表達(dá)式里面存的是函數(shù)
//(3) 函數(shù)表達(dá)式也可以進(jìn)行傳遞參數(shù)
總結(jié)
本篇文章就到這里了，希望能夠給你帶來幫助，也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
1. 聲明函數(shù)
//聲明函數(shù)
function 函數(shù)名() {
//函數(shù)體代碼
}
function是聲明函數(shù)的關(guān)鍵字，必須小寫由于函數(shù)一般是為了實(shí)現(xiàn)某個(gè)功能才定義的，所以通常我們將函數(shù)名命名為動(dòng)詞，比如getSum
2. 調(diào)用函數(shù)
//調(diào)用函數(shù) 函數(shù)名(); //通過調(diào)用函數(shù)名來執(zhí)行函數(shù)體代碼
聲明函數(shù)本身并不會(huì)執(zhí)行的代碼，只有調(diào)用函數(shù)時(shí)才會(huì)執(zhí)行函數(shù)體代碼。
3. 函數(shù)的參數(shù)
在聲明函數(shù)時(shí)，可以在函數(shù)名稱后面的小括號(hào)中添加一些參數(shù)，這些參數(shù)被稱為形參，而在調(diào)用該函數(shù)時(shí)，同樣也需要傳遞相應(yīng)的參數(shù)，這些參數(shù)被稱為實(shí)參。
| 參數(shù) | 說明 |
|---|---|
| 形參 | 形式上的參數(shù) 函數(shù)定義的時(shí)候 傳遞的參數(shù) 當(dāng)前并不知道是什么 |
| 實(shí)參 | 實(shí)際上的參數(shù) 函數(shù)調(diào)用的時(shí)候傳遞的參數(shù) 實(shí)參是傳遞給形參的 |
參數(shù)的作用：在函數(shù)的內(nèi)部某些值不能固定，我們可以通過參數(shù)在調(diào)用函數(shù)時(shí)傳遞不同的值進(jìn)去。
函數(shù)形參和實(shí)參個(gè)數(shù)不匹配問題
| 參數(shù)個(gè)數(shù) | 說明 |
|---|---|
| 實(shí)參個(gè)數(shù)等于形參個(gè)數(shù) | 輸出正確結(jié)果 |
| 實(shí)參個(gè)數(shù)多于形參個(gè)數(shù) | 只取到形參的個(gè)數(shù) |
| 實(shí)參個(gè)數(shù)少于形參個(gè)數(shù) | 多的形參定義為undefined，結(jié)果為NaN |
function sum(num1,num2) {
console.log(num1+num2);
}
sum(100,200); //實(shí)參個(gè)數(shù)等于形參個(gè)數(shù) 輸出正確結(jié)果
sum(100,400,500,700); //實(shí)參個(gè)數(shù)多于形參個(gè)數(shù) 只取到形參的個(gè)數(shù)
sum(200); //實(shí)參個(gè)數(shù)少于形參個(gè)數(shù) 多的形參定義為undefined，結(jié)果為NaN
在JavaScript中，形參的默認(rèn)值是undefined 。
4. 函數(shù)的返回值
經(jīng)常用return返回函數(shù)值
return終止函數(shù)
function add(num1,num2) {
//函數(shù)體
return num1+num2; //注意：return后的代碼不執(zhí)行
alert('前面有return，我不會(huì)被執(zhí)行');
}
var resNum = add(21,6); //調(diào)用函數(shù)，傳入兩個(gè)實(shí)參，并通過resNum接收函數(shù)返回值
alert(resNum); //27
如果函數(shù)有return，則返回return后面的值；如果沒有return，則返回 undefined 。
break，continue，return的區(qū)別
break：結(jié)束當(dāng)前的循環(huán)體(如for、while)continue：跳出本次循環(huán)，繼續(xù)執(zhí)行下次循環(huán)(如for、while)return：不僅可以退出循環(huán)，還能夠返回return語句中的值，同時(shí)還可以結(jié)束當(dāng)前的函數(shù)體內(nèi)的代碼。
5. arguments的使用
當(dāng)我們不確定有多少個(gè)參數(shù)傳遞的時(shí)候，可以用arguments來獲取，在JavaScript中，arguments實(shí)際上它是當(dāng)前函數(shù)的一個(gè)內(nèi)置對(duì)象。所有函數(shù)都內(nèi)置了一個(gè)arguments對(duì)象，arguments對(duì)象中存儲(chǔ)了傳遞的所有實(shí)參。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
function fn() {
console.log(arguments); //里面存儲(chǔ)了所有傳遞過來的實(shí)參
console.log(arguments.length);
console.log(arguments[2]);
//可以按照數(shù)組的方式遍歷arguments
for (var i = 0; i < arguments.length; i++) {
console.log(arguments[i]);
}
}
fn(1, 2, 3);
fn(1, 2, 3, 4, 5);
//偽數(shù)組 并不是真正意義上的數(shù)組
//1. 具有數(shù)組的length 屬性
//2. 按照索引的方式進(jìn)行存儲(chǔ)的
//3. 它沒有真正數(shù)組的一些方法 如pop() push()等等
</script>
</head>
<body>
</body>
</html>
6. 函數(shù)可以調(diào)用另外一個(gè)函數(shù)
function fn1() {
console.log(111);
fn2();
console.log('fn1');
}
function fn2() {
console.log(222);
console.log('fn2');
}
fn1();
7. 函數(shù)的兩種聲明方式
//1. 利用函數(shù)關(guān)鍵字自定義函數(shù)(命名函數(shù))
function fn() {
}
fn();
//2. 函數(shù)表達(dá)式(匿名函數(shù))
//var 變量名 = function() {};
var fun = function(aru) {
console.log('我是函數(shù)表達(dá)式');
console.log(aru);
}
fun('FG'）；
//(1) fun是變量名 不是函數(shù)名
//(2) 函數(shù)表達(dá)式聲明方式跟聲明變量差不多，只不過變量里面存的是值 而函數(shù)表達(dá)式里面存的是函數(shù)
//(3) 函數(shù)表達(dá)式也可以進(jìn)行傳遞參數(shù)
總結(jié)
本篇文章就到這里了，希望能夠給你帶來幫助，也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
Javascript下的keyCode鍵碼值表...2007-04-04
基于bootstrap-datetimepicker.js不支持IE8的快速解決方法
下面小編就為大家?guī)硪黄赽ootstrap-datetimepicker.js不支持IE8的快速解決方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-11-11
本文為大家介紹下如何改變隱藏的input中value的值，一句代碼就可以實(shí)現(xiàn)，感性的朋友可以參考下2013-12-12
javascript實(shí)現(xiàn)圖片左右滾動(dòng)效果【可自動(dòng)滾動(dòng)，有左右按鈕】
這篇文章主要介紹了javascript實(shí)現(xiàn)圖片左右滾動(dòng)效果,可實(shí)現(xiàn)自動(dòng)滾動(dòng),帶有左右按鈕功能,基于插件scrollPic.js實(shí)現(xiàn),附帶了相應(yīng)的demo源碼供讀者下載參考,需要的朋友可以參考下2016-09-09
Generator 是一種非常強(qiáng)力的語法，但它的使用并不廣泛。這篇文章主要介紹了如何在 JavaScript 中使用 Generator,需要的朋友可以參考下2017-12-12
本文主要介紹了jquery源碼中常見的知識(shí)點(diǎn)以及javascript中原型鏈常見的知識(shí)點(diǎn)，非常的全面，這里推薦給小伙伴們。2015-03-03
js綜合應(yīng)用實(shí)例簡(jiǎn)單的表格統(tǒng)計(jì)
在做調(diào)查問卷的過程中，遇到一個(gè)表格的統(tǒng)計(jì)問題，一個(gè)需要用到j(luò)s方面的綜合知識(shí)，感覺還不錯(cuò)所以記錄下來與大家分享，感興趣的朋友可以了解下2013-09-09
《JavaScript DOM 編程藝術(shù)》讀書筆記之JavaScript 簡(jiǎn)史
這篇文章主要介紹了《JavaScript DOM 編程藝術(shù)》讀書筆記之JavaScript 簡(jiǎn)史,需要的朋友可以參考下2015-01-01
最近一直在弄手機(jī)端的游戲，接觸到各種動(dòng)畫。加之對(duì)之前的自己那個(gè)動(dòng)畫類不滿意，就有心想寫個(gè)新的。然后翻看各種博客，查資料。也學(xué)到一些新的東西2012-08-08
這篇文章主要介紹了Bootstrap4如何定制自己的顏色和風(fēng)格，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-02-02