輕鬆學JavaScript--函式中的預設引數
JavaScript函式可以有預設引數值。通過預設函式引數,你可以初始化帶有預設值的正式引數。如果不初始化具有某些值的引數,則該引數的預設值為undefined。
請看下列程式碼:
function foo(num1){
console.log(num1);
}
foo();
在呼叫函式foo時,你沒有傳遞任何引數,因此變數num1的預設值設定為undefined。但是,有時你可能需要設定預設值而非undefined。過去,最好的策略是測試引數值undefined,然後分配一個值。所以,在上面的例子中,如果你想要將num1的預設值設定為9,那麼你可以按照以下程式碼所示的方式做:
function foo(num1){
if(num1===undefined){
num1=9;
}
console.log(num1);
}
foo();
ECMAScript 6引入了函式的預設引數。使用ECMA 2015的預設引數功能,你將不再需要檢查未定義的引數值。現在,你可以將9設定為引數本身的預設值。你可以重寫上述函式以使用預設值,如下所示:
function foo(num1=9){
console.log(num1);
}
foo();
對於函式foo,如果num1引數的值未被傳遞,那麼JavaScript將設定9作為num1的預設值。
檢查未定義的引數
即使你在呼叫函式時明確地傳遞undefined作為引數值,引數值也將設定為預設值。
function foo(num1=9){
console.log(num1);
}
foo(undefined);
在上面的程式碼中,你傳遞undefined為num1的值;因此,num1的值將被設定為預設值9。
執行時計算預設值
JavaScript函式預設值在執行時計算。為了更好地理解這一點,請看以下程式碼:
function foo(value=koo()){
return value;
}
function koo(){
return"Ignite UI";
}
var a=foo();
console.log(a);
在函式foo中,引數值的預設值設定為函式koo。在執行時呼叫函式foo時,將計算函式koo。呼叫foo函式後,你會得到如下圖所示的輸出(在這個例子中,我們使用了Ignite UI框架)。
重用預設引數
預設引數可供之後的預設引數使用。請看下列程式碼:
function foo(num1=9,num2=num1+8){
console.log(num2);
}
foo();
在上面的程式碼中,使用num1的預設值來計算num2的預設值。呼叫函式foo時將得到以下輸出:
結論
JavaScript預設引數在編寫函式時非常有用。在呼叫函式時,如果缺少引數,則預設引數功能允許你為函式引數分配預設值,而不是將其定義為undefined。