函數(shù)是計(jì)算機(jī)程序的主要部分之一。它們是 JavaScript 的基本構(gòu)建塊之一并且被廣泛使用。在本文中,我們將討論函數(shù)的定義以及它們?yōu)楹稳绱酥匾?。我還將向您展示如何開(kāi)始使用 JavaScript 編寫(xiě)函數(shù)。
讓我們開(kāi)始學(xué)習(xí)吧!
JavaScript 中的函數(shù)是什么?
函數(shù)是一個(gè)代碼塊,它封裝了一個(gè)獨(dú)立的、自包含的行為,供計(jì)算機(jī)執(zhí)行。
函數(shù)是一組有組織的指令,它們對(duì)應(yīng)于用戶(hù)想要在他們的程序中實(shí)現(xiàn)的特定任務(wù)或特定功能,以實(shí)現(xiàn)單個(gè)所需的結(jié)果。
函數(shù)內(nèi)的代碼僅在需要時(shí)運(yùn)行,即僅在調(diào)用時(shí)運(yùn)行。
函數(shù)是編程中一個(gè)重要且有用的部分,因?yàn)樗鼈儎?chuàng)建了可重用的代碼。
無(wú)需在程序的不同部分復(fù)制、粘貼和重復(fù)相同的代碼,您可以使用函數(shù)僅在一處編寫(xiě)該代碼。然后,您可以在需要時(shí)反復(fù)使用它。
當(dāng)您想對(duì)程序進(jìn)行更改或調(diào)試并嘗試修復(fù)錯(cuò)誤時(shí),這也很有幫助。
無(wú)需尋找代碼可能位于的不同部分,您只需查看一個(gè)使代碼更具可讀性的特定位置。
如何在 JavaScript 中聲明函數(shù)
在 JavaScript 中創(chuàng)建函數(shù)的一般語(yǔ)法如下所示:
function name(parameter1,parameter2,...) {
// the code statements to be executed
}
讓我們分解一下:
- 你用function關(guān)鍵字聲明一個(gè)函數(shù)。
- 接下來(lái),您為該函數(shù)指定一個(gè)您選擇的名稱(chēng)。JavaScript 中的函數(shù)名稱(chēng)區(qū)分大小寫(xiě),約定和最佳實(shí)踐是使用駝峰命名法。
- 函數(shù)名稱(chēng)后跟一組左括號(hào)和右括號(hào)。
函數(shù)可以通過(guò)輸入來(lái)接收數(shù)據(jù)。這些輸入括在括號(hào)中,稱(chēng)為參數(shù)。
參數(shù)用作值的局部占位符變量,這些值將在調(diào)用函數(shù)時(shí)作為輸入傳遞到函數(shù)中。它們完全是可選的,如果有多個(gè),則用逗號(hào)分隔它們。
- 最后是花括號(hào),在它們內(nèi)部是函數(shù)的主體以及在調(diào)用函數(shù)時(shí)要執(zhí)行的代碼語(yǔ)句。這是處理函數(shù)輸入的地方。
如何在 JavaScript 中聲明和調(diào)用一個(gè)簡(jiǎn)單的函數(shù)
function greeting() {
console.log('Hello World!');
}
上面,我們創(chuàng)建了一個(gè)名為greeting的函數(shù)。
這個(gè)功能是一個(gè)非?;镜墓δ埽墓δ芊浅我?。它不接受任何輸入,唯一執(zhí)行的事件就是將Hello World!打印到控制臺(tái)。
定義一個(gè)函數(shù)本身并不會(huì)在函數(shù)體內(nèi)運(yùn)行代碼。如果我們想要看到運(yùn)行結(jié)果,必須調(diào)用該函數(shù)。這也稱(chēng)為函數(shù)調(diào)用。
要調(diào)用不接受輸入的函數(shù),只需編寫(xiě)函數(shù)名稱(chēng),后跟括號(hào)和分號(hào)。
greeting();
//output
//Hello World!
現(xiàn)在,您只需多次調(diào)用該函數(shù)本身即可多次重用該函數(shù)。這有助于避免重復(fù)代碼:
greeting();
greeting();
greeting();
//output
// Hello World!
// Hello World!
// Hello World!
如何在 JavaScript 中聲明和調(diào)用帶參數(shù)的函數(shù)
我們可以修改前面的示例以獲取輸入。如前所述,我們將使用參數(shù)執(zhí)行此操作。
參數(shù)是您在聲明函數(shù)時(shí)傳遞給函數(shù)的值。
function greeting(name) {
console.log('Hello ' + name + ' !' );
}
命名的greeting函數(shù)現(xiàn)在接受一個(gè)參數(shù)name。在函數(shù)中將hello字符串使用+與name 和末尾的感嘆號(hào)連接 。
調(diào)用接受參數(shù)的函數(shù)時(shí),需要傳入?yún)?shù)。
參數(shù)是您在調(diào)用函數(shù)時(shí)提供的值,它們對(duì)應(yīng)于在函數(shù)的聲明行中傳遞的參數(shù)。
例如:
greeting('Jenny');
//Output
// Hello Jenny !
參數(shù)是值Jenny,您可以將其視為name = 'Jenny'。name,參數(shù),是占位符變量,Jenny是調(diào)用函數(shù)時(shí)傳入的值。
函數(shù)可以接受多個(gè)參數(shù),也可以將數(shù)據(jù)返回給程序的用戶(hù):
function addNums(num1,num2) {
return num1 + num2;
}
上面的代碼創(chuàng)建了一個(gè)名為addNums的函數(shù),它接受兩個(gè)參數(shù) num1和num2,用逗號(hào)分隔。
與函數(shù)輸入的方式相同,它們也輸出一個(gè)值
該函數(shù)將num1和 num2的和作為其輸出返回。這意味著它處理這兩個(gè)參數(shù),執(zhí)行請(qǐng)求的計(jì)算,并將最終值作為結(jié)果返回給用戶(hù)。
調(diào)用函數(shù)時(shí),必須傳入兩個(gè)參數(shù),因?yàn)樗邮軆蓚€(gè)參數(shù):
addNums(10,20);
//Output
// 30
// think of it as num1 = 10 and num2 = 20
每次調(diào)用該函數(shù)時(shí),您都可以傳入不同的參數(shù):
addNums(2,2);
// 4
addNums(3,15);
//18
JavaScript 函數(shù)中的變量范圍
變量范圍是指變量對(duì)程序不同部分的可見(jiàn)性。
在函數(shù)塊外部和之前定義的變量具有全局作用域,可以從函數(shù)內(nèi)部訪(fǎng)問(wèn):
const num = 7;
function myFunc() {
console.log(num);
}
//Access the variable with a global scope from anywhere in the program:
console.log(num);
//Output
//7
//Call the function with the variable with global scope
myFunc();
//Output
// 7
但是,如果該變量是在函數(shù)內(nèi)部定義的,它將具有局部作用域,并且僅在定義它的函數(shù)中受到限制和可見(jiàn)。
您無(wú)法從函數(shù)外部訪(fǎng)問(wèn)它:
function myFunc() {
const num = 7;
console.log(num);
}
// Try to access the variable with local scope from outside the function scope:
console.log(num);
//Otput:
//Uncaught ReferenceError: num is not defined
//Call the function with the variable defined inside the function:
myFunc();
//Ouput
//7
函數(shù)表達(dá)式
您還可以使用表達(dá)式創(chuàng)建函數(shù)。
這些函數(shù)是在表達(dá)式中創(chuàng)建的,而不是像您目前看到的那樣使用函數(shù)聲明創(chuàng)建。
const name = function(firstName) {
return 'Hello ' + firstName ;
}
在這里,我們使用變量name來(lái)存儲(chǔ)函數(shù)。
要調(diào)用該函數(shù),您可以像這樣使用變量名:
console.log(name('Jenny'));
//Output
//"Hello Jenny"
這種類(lèi)型的函數(shù)也稱(chēng)為匿名函數(shù),因?yàn)樗鼈儾恍枰Q(chēng)。
下面列出了命名函數(shù)和匿名函數(shù)之間的區(qū)別:
//named
function name(firstName) {
console.log('Hello ' + firstName);
}
name('Jenny');
//anonymous
const name = function(firstName) {
return 'Hello ' + firstName ;
}
console.log(name('Jenny'));
匿名函數(shù)中的變量也可以用作其他變量的值:
const name = function(firstName) {
return 'Hello ' + firstName ;
}
const myName = name('Timmy');
console.log(myName);
//Ouput
//"Hello Timmy"