ES6 -- 能爲函式參數直接指定預設值

ES5中, 無法直接為函式參數設定預設值, 要用其他方法, 但在ES6可以。


ES5中為函式參數設定預設值的方法:

e.g.

function link1(height, color, url) {

    var height = height || 50;                                          // 利用短路邏輯(||): 有值傳入就優先assign值給變數名稱; 沒有值就是將50(作為預設值)assign給變數名稱
    var color = color || "red";
    var url = url || "http://www.abc.com";

    console.log(height, color, url);

}

link1(null, "Blue");                                                            // 50  "Blue"  "http://www.abc.com"    (因為null是falsey值, 所以使用預設值; 而url無值傳入, 也是使用預設值)

link1(undefined, "", "http://www.xyz.com");            // 50  "red"  "http://www.xyz.com"    (因為undefined和""是falsey值, 所以使用預設值)



ES6中可直接對函式參數設定預設值:

e.g.

function link2(height = 50, color = "red", url = "http://www.abc.com") {              // 在此就可直接指定預設值

    console.log(height, color, url);

}

link2(undefined, "Blue");                                              // 50  "Blue"  "http://www.abc.com"    (因為url無值傳入, 也是使用預設值)

link2(undefined, "", "http://www.xyz.com");          // 50  ""  "http://www.xyz.com"    (在ES6中, 判斷如果是undefined, 則給預設值; 如果非undefined, 如"" 或 null, 則直接給""或null, 而不是給預設值)