js學習(16)----函式宣告和函式作為引數
阿新 • • 發佈:2019-01-10
1.函式宣告和函式表示式
函式宣告需要被呼叫才會執行相應的內容,而函式表示式則相當於呼叫了函式。
如下:
// 這是函式宣告,沒有看到;號
function sum(num1, num2) {
// 函式體
}
// 這是函式表示式
var result = function(num1, num2) {
// 函式體
}
2.宣告提升(function declaration hoisting)
函式宣告和函式表示式涉及到到函式宣告提升的問題。
即在js中,函式宣告會被提到頂部,解析器會率先讀取函式宣告,並使得其在執行任何程式碼之前可以執行;而表示式則必須等到解析器執行到它所在的程式碼行時,才會真正地被解釋執行。
注:對於函式表示式中的函式定義是不會提前的。
注:對於變數,變數也會宣告提前,但是變數的初始化則在程式碼所在的位置執行,不會提前。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p id="result">Show</p>
<script type="text/javascript">
alert(sum(4, 2));
function sum(num1, num2) {
return num1 + num2;
}
function sum(num1, num2) {
return (num1 + num2) * 2;
}
</script>
</body>
</html>
上面的程式碼可以正常的執行並且輸出結果是12;
原因是:宣告提前,但是因為第二個函式定義的名稱與引數與第一個相同,所以覆蓋了第一個,宣告提前後,當執行到語句alert(sum(4, 2))時,就會得到相應的結果,所以是12。
3.函式作為引數
一個函式可以想傳遞引數一樣傳遞給另一個函式。
舉個例子:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p id="result">Show</p>
<script type="text/javascript">
function addOne(num) {
return num + 1;
}
function callSomeFunction(someFunction, someArgument) {
return someFunction(someArgument);
}
var result = callSomeFunction(addOne, 1);
alert(result);
</script>
</body>
</html>
4.返回一個函式
一個函式可以作為另外一個函式的結果返回。
舉個例子:
注:陣列的sort方法可以傳入一個函式作為引數,因為如果是按照預設的排序方式的話,10小於2(因為1的ASCII碼比2小),但是這不符合我們的要求,所以常常會傳入一個比較函式。
<script type="text/javascript">
function createCompareFunction(propertyName) {
return function(object1, object2) {
var value1 = object1[propertyName];
var value2 = object2[propertyName];
if (value1 > value2) {
return 1;
} else if (value1 < value2) {
return -1;
} else {
return 0;
}
}
}
var data = [{name:"Ann", age:20}, {name:"Tome", age:22}];
data.sort(createCompareFunction("name"));
</script>