初探預設參數

前言

  最近抽空來學習 JavaScript 的新功能"預設參數"，在此把學習的過程做個紀錄。

內容

  在舊的 JavaScript 裡的 function 參數都是不能給預設值，只能單純的命名，在喚起 function 時，有多少個參數就要輸入多少個參數，在新的 JavaScript 開始支援了。接著來看範例

function testCall(arg1 = 1234 , arg2 = 5678){
  console.log( `arg1:${arg1} arg2:${arg2}` );
};
function testCallForTest(arg1 =1234 ,arg2 ,arg3 = 5678){
  console.log( `arg1:${arg1} arg2:${arg2} arg3:${arg3}` );
};

testCall( 9999 , 8888 );//arg1:9999 arg2:8888
testCall( 9999 );//arg1:9999 arg2:5678
testCallForTest( 9999 );//arg1:9999 arg2:undefined arg3:5678
testCallForTest( 9999 , 8888 );//arg1:9999 arg2:8888 arg3:5678

範例第一次喚起 testCall() 時用一般喚起的方式(參數全給)，但在第二次少給一個，可以看到被替代的參數是第一個，接著注意到 testCallForTest() ，宣告時 arg2 並沒有給預設參數，藉此來看看會有什麼反應，第一次喚起 testCallForTest() 時只給了一個參數，結果是第二個參數變成 undefined ，但第三個參數的預設參數卻會成功給予，最後看到第二次喚起 testCallForTest() ，這次給了兩個參數，可以看到 arg2 有被正確地給予，且第三個參數的預設參數也有正確的給予。整體看下來預設參數的給予是有順序性的，總是從最前面參數來覆蓋，如果沒正常覆蓋只會給個 undefined ，並不會跳錯誤訊息，不過這是用 Chrome 所測試出來的反應，最後看了一下這個功能有個熱門瀏覽器 Opera 到現在還沒支援，如果要跨瀏覽器時要注意。

 

參考資料

[ developer.mozilla.org ] 預設參數( Default parameters )