ES6函數默認參數（Default Parameters）

語言更新時每個新增的特性都是從千百萬開發者需求裏提取過來的，規範採用後能減小程序員的痛苦，帶來便捷。

 

咱們常常會這麼寫

function calc(x, y) {
    x = x || 0;
    y = y || 0;
    // to do with x, y
    // return x/y
}

簡單說就是x，y提供了一個默認值爲0，不傳時x, y以值0來運算。傳了就以實際值計算。

 

又如定義一個ajax

function ajax(url, async, dataType) {
    async = async !== false
    dataType = dataType || 'JSON'
    // ...
}

本身用原生JS封裝的一個簡易ajax函數，url必填，async和dataType可選，即不填時默認同步請求和返回JSON格式數據。

 

再如定義一個矩形類

function Rectangle(width, height) {
    this.width = width || 200;
    this.height = height || 300;
}

new時不傳任何參數，也會建立一個默認寬高爲200*300的矩形。

 

不管是calc，ajax函數仍是Rectangle類，咱們都須要在函數體內作默認值的處理，若是語言自身處理豈不樂哉？ ES6提供了該特性（Default Parameters），如下是用ES6新特性重寫的calc，ajax，Rectangle。

function calc(x=0, y=0) {
    // ...
    console.log(x, y)
}
calc(); // 0 0
calc(1, 4); // 1 4

function ajax(url, async=true, dataType="JSON") {
    // ...
    console.log(url, async, dataType)
}
ajax('../user.action'); // ../user.action true JSON
ajax('../user.action', false); // ../user.action false JSON
ajax('../user.action', false, 'XML'); // ../user.action false XML

function Rectangle(width=200, height=300) {
    this.width = width;
    this.height = height;
}
var r1 = new Rectangle(); // 200*300的矩形
var r2 = new Rectangle(100); // 100*300的矩形
var r3 = new Rectangle(100, 500); // 100*500矩形

能夠看到，ES6把默認值部分從大括號移到了小括號裏，還減小了「||」運算，函數體今後瘦身了。參數默認值嘛，原本就應該在定義參數的地方，這樣看起來簡潔了很多。O(∩_∩)O

 

默認參數能夠定義在任意位置，好比在中間定義一個

function ajax(url, async=true, success) {
    // ...
    console.log(url, async, success)
}

定義了一個默認參數async，url和success是必傳的，這時須要把中間的參數置爲undefined

ajax('../user.action', undefined, function() {
    
})

注意，不要想固然的把undefined改成null，  即便 null == undefined， 傳null後，函數體內的async就是null不是true了。

 

如下幾點須要注意：

1. 定義了默認參數後，函數的length屬性會減小，即有幾個默認參數不包含在length的計算當中

function calc(x=0, y=0) {
    // ...
    console.log(x, y)
}
function ajax(url, async=true, dataType="JSON") {
    // ...
    console.log(url, async, dataType)
}
console.log(calc.length); // 0
console.log(ajax.length); // 1

 

2. 不能用let和const再次聲明默認值，var能夠

function ajax(url="../user.action", async=true, success) {
	var url = ''; // 容許
	let async = 3; // 報錯
	const success = function(){}; // 報錯
}

 

 

另外比較有趣的是：默認參數能夠不是一個值類型，它能夠是一個函數調用

function getCallback() {
	return function() {
		// return code
	}
}

function ajax(url, async, success=getCallback()) {
    // ...
    console.log(url, async, success)
}

能夠看到這裏參數success是一個函數調用，調用ajax時若是沒有傳第三個參數，則會執行getCallback函數，該函數返回一個新函數賦值給success。這是一個很強大的功能，給程序員以很大的想象發揮空間。

 

例如，利用這個特性能夠強制指定某參數必須傳，不傳就報錯

function throwIf() {
	throw new Error('少傳了參數');
}

function ajax(url=throwIf(), async=true, success) {
	return url;
}
ajax(); // Error: 少傳了參數