理解JavaScript中函數方法
- 2019 年 10 月 6 日
- 筆記
1.函數聲明和函數表達式
通過字面量創建函數的方式有兩種函數聲明和函數表達式:
函數聲明:
function sum(x, y) { var result = x + y; return result; }
函數表達式:
var sum = function (x, y) { var result = x + y; return result; };
函數聲明和函數表達式除了在語法上有一些差異外,作用都是一樣的。
函數聲明被提升到上下文的頂部(函數所在的作用域)。也就是說我們可以在函數聲明之前使用它,並且不會產生錯誤。例如:
var result = sum(3, 5); console.log(result); function sum(x, y) { var result = x + y; return result; }
但是,函數表達式不能被提升,下面的程式碼會報錯:
var result = sum(3, 5); console.log(result); var sum = function (x, y) { var result = x + y; return result; };
建議大家無論在使用哪種字面量的方式創建Function類型的對象時,一定要先聲明後使用。
2.將函數作為值
我可以像其他對象那樣使用函數,比如,可以將它們賦值給另一個變數,可以將將它們作為對象的屬性值,可以作為參數傳遞給其他函數,還可以作為其他函數的返回值。
1.可以將它們賦值給另一個變數
function sayHi() { console.log('Hi!'); } sayHi(); var sayHi2 = sayHi; sayHi2();
2.可以將將它們作為對象的屬性值
function sayHi() { console.log('Hi!'); } var person = { name: '張三', greeting: sayHi }; person.greeting();
3.可以作為參數傳遞給其他函數
var numbers = [1, 25, 18, 4, 7, 10, 2, 6]; var result1 = numbers.sort(); console.log(result1); var result2 = numbers.sort(function(a, b){ return a - b; }); console.log(result2);
4.可以作為其他函數的返回值
function parent(){ var i = 0; function child(){ i++; console.log(i); } return child; } var func = parent(); func();
3.函數的參數
形參:創建函數時,指定的參數。 實參:調用函數時,實際傳遞給函數的參數。
函數另一獨特之處是無論我們傳遞給它多少個參數它都不會報錯。這是因為我們傳遞給函數的實參實際上被保存到了一個類似於數組的對象中,arguments
,數組可以包含任意數量的元素,所以可以我們向函數傳遞任意數量的實參。我們在訪問這些參數的時候可以通過數組下表的方式訪問。
function sum (x, y){ return x + y; } var result1 = sum(2, 3); console.log(result1); var result2 = sum(2, 3, 5, 6); console.log(result2); var result3 = sum(); console.log(result3); var result4 = sum(2); console.log(result4);
由於函數沒有形參,我們必須閱讀函數體內的程式碼才能知道函數需要幾個形參,所以很多開發人員願意使用arguments
對象。例如:
function sum(){ return arguments[0] + arguments[1]; }
然而,有些時候使用arguments
比使用形參更高效。比如,我們要創建一個用來求和的函數,它可以接受任意數量的參數,並返回它們的和。這個時候我們就不能形參,因為我們不知道會傳遞過來多少個實參,因此,使用arguments
是最好的選擇。
function sum() { var result = 0, i = 0, len = arguments.length; while(i < len){ result += arguments[i]; i++; } return result; } console.log(sum(2, 5, 7, 5, 5 ,90));