在 JavaScript 中，我們有不同的方法來定義函數(shù)。 function foo() {} 和 var foo = function() { } 是定義函數(shù)的兩種不同方式。兩種方式都有其優(yōu)點和不同的用例；但是，執(zhí)行該函數(shù)時兩者給出相同的結(jié)果。
因此，本教程將教我們定義函數(shù)的兩種方法之間的區(qū)別。
函數(shù) foo() { } 的解釋：函數(shù)聲明
function foo() { } 是在 JavaScript 中聲明函數(shù)的常規(guī)方法，每個初學者和開發(fā)人員都會使用。另外，我們可以將其稱為命名函數(shù)。
當程序執(zhí)行控制到達函數(shù)聲明的作用域時，JavaScript 會對函數(shù)聲明進行求值。函數(shù)聲明評估不是逐步過程的一部分，而是在開始時進行評估。
此外，函數(shù)聲明被提升到聲明它的特定范圍內(nèi)的每個代碼的頂部。因此，我們可以在作用域中的任何位置調(diào)用該函數(shù)，甚至在聲明之前。
語法
用戶可以按照下面的語法來聲明函數(shù)。
function foo(parameters, .... ) {
// function body
}
登錄后復(fù)制
在上面的語法中，‘function’是代表函數(shù)聲明的關(guān)鍵字，foo是函數(shù)名。
示例
在此示例中，我們通過函數(shù)聲明定義了函數(shù) foo()。之后，我們像調(diào)用普通函數(shù)一樣調(diào)用它。
<html>
<body>
<h2>function foo() { } (function declaration)</h2>
<div id="output"></div>
<script>
let output = document.getElementById("output");
// declaring the function
function foo() {
output.innerHTML += "The function foo is invoked!";
}
foo();
</script>
</body>
</html>
登錄后復(fù)制
示例
在下面的示例中，我們定義了帶有參數(shù)的函數(shù)。我們將 invokedPosition 作為第二個參數(shù)傳遞，表示我們調(diào)用該函數(shù)的位置。
我們在聲明之前調(diào)用了 foo() 函數(shù)，因為當執(zhí)行流進入作用域并提升到頂部時，JavaScript 會在開始時計算該函數(shù)。
<html>
<body>
<h2>function foo() { } (function declaration)</h2>
<div id="output"></div>
<script>
let output = document.getElementById("output");
// As foo is hoisted on top, we can call the function before the declaration
foo(10, "Top");
// declaring the function with parameters
function foo(param1, inovkingPosition) {
output.innerHTML += "The function foo is invoked from " + inovkingPosition + "</br>";
output.innerHTML += "The value of the param1 is " + param1 + " <br/> <br/>";
}
foo(20, "bottom");
</script>
</body>
</html>
登錄后復(fù)制
var foo = function() { } 的解釋：函數(shù)表達式
var foo = function() { } 也與定義函數(shù)相同，稱為函數(shù)表達式。這里， function() { } 是我們存儲在 foo 變量中的函數(shù)表達式。 foo 和其他變量一樣是一個普通變量，甚至我們可以在 foo 變量中存儲數(shù)字和字符串。
JavaScript 不會像函數(shù)聲明那樣在開始時計算函數(shù)表達式。它逐步評估函數(shù)表達式。當執(zhí)行流到達函數(shù)表達式時，JavaScript 會計算該表達式并將其存儲在 foo 變量中。
此外，函數(shù)表達式?jīng)]有被提升到代碼的頂部，因此我們不能像函數(shù)聲明一樣在定義函數(shù)表達式之前調(diào)用它。
語法
用戶可以按照下面的語法使用函數(shù)表達式來定義函數(shù)。
var foo = function (params) {
// function body
};
登錄后復(fù)制
在上面的語法中，函數(shù)的定義沒有名字，所以我們可以稱它為匿名函數(shù)。我們可以使用 foo 變量作為函數(shù)的標識符。
示例
在此示例中，我們使用函數(shù)表達式定義了函數(shù)并將其存儲在 foo 標識符內(nèi)。之后，我們使用 foo 標識符來調(diào)用存儲在其中的函數(shù)表達式，并在 foo 標識符中傳遞參數(shù)。
<html>
<body>
<h2>var foo = function() { } (function expression)</h2>
<div id="output"></div>
<script>
let output = document.getElementById("output");
// defining the function expression and storing it in the foo variable
var foo = function (param) {
output.innerHTML += "Inside the function expression. </br>";
output.innerHTML += "The value of the param is " + param + "</br>";
};
// calling the function expression via foo identifier
foo("Hi Users!");
</script>
</body>
</html>
登錄后復(fù)制
函數(shù)表達式有不同的用例。用戶可以將其作為回調(diào)函數(shù)來編寫函數(shù)的簡短語法。此外，用戶還可以將其用作閉包函數(shù)。有時，我們需要將函數(shù)作為參數(shù)傳遞，然后我們就可以使用函數(shù)表達式。
示例
在此示例中，我們將函數(shù)表達式作為 sort() 方法的參數(shù)傳遞。用戶可以看到我們將匿名函數(shù)作為參數(shù)傳遞，而不是用名稱編寫聲明。
<html>
<body>
<h2>Passing function expression as an argument</h2>
<div id="output"></div>
<script>
let output = document.getElementById("output");
let number = [320, 45, 3, 23, 54];
// passing the function expression as an argument of the sort() method
number.sort(function (element1, element2) {
return element2 - element1;
});
output.innerHTML += "The sorted array is " + number;
</script>
</body>
</html>
登錄后復(fù)制
function foo() { } 和 var foo = function() { } 之間的區(qū)別
下表重點介紹了 function foo() { } 和 var foo = function() { } 之間的主要區(qū)別：
|
函數(shù) foo() { } |
var foo = function() { } |
|---|---|
|
這是一個函數(shù)聲明。 |
它是一個函數(shù)表達式。 |
|
它被懸掛在瞄準鏡的頂部。 |
它沒有在范圍內(nèi)提升。 |
|
JavaScript 在作用域執(zhí)行開始時對其進行評估。 |
JavaScript 在逐步執(zhí)行代碼時對其進行評估。 |
|
我們可以通過函數(shù)名來識別它。 |
我們可以使用存儲它的標識符來識別它。 |
|
用于定義普通函數(shù)。 |
當我們需要傳遞函數(shù)作為參數(shù)或需要使用函數(shù)作為閉包時使用它。 |
結(jié)論
在 JavaScript 中，有兩種定義函數(shù)的方法：函數(shù)聲明和函數(shù)表達式。函數(shù)聲明是使用 function 關(guān)鍵字定義的，后跟函數(shù)名稱，通常寫為 function foo() {}。當程序執(zhí)行到達聲明函數(shù)的作用域時，JavaScript 會對函數(shù)聲明進行求值，并將函數(shù)聲明提升到該作用域中代碼的頂部。這意味著可以在聲明之前調(diào)用它們。
函數(shù)表達式是使用變量定義的，通常寫為 var foo = function() {}。函數(shù)表達式不會被提升，必須在調(diào)用之前定義。函數(shù)聲明和函數(shù)表達式可以執(zhí)行相同的任務(wù)，但它們具有不同的語法和計算行為。
以上就是解釋一下 function foo() {} 和 var foo = function() {} 在 foo 用法上的區(qū)別的詳細內(nèi)容，更多請關(guān)注www.92cms.cn其它相關(guān)文章！
