在 ES6 之前，不能直接為函數(shù)的參數(shù)指定默認值，只能采用變通的方法。
function log(x, y) {
y = y || 'World';
console.log(x, y);
}
log('Hello') // Hello World
log('Hello', 'China') // Hello China
log('Hello', '') // Hello World上面代碼檢查函數(shù) log 的參數(shù)y有沒有賦值，如果沒有，則指定默認值為 World。這種寫法的缺點在于，如果參數(shù)y賦值了，但是對應的布爾值為 false，則該賦值不起作用。就像上面代碼的最后一行，參數(shù) y 等于空字符，結果被改為默認值。
為了避免這個問題，通常需要先判斷一下參數(shù) y 是否被賦值，如果沒有，再等于默認值。這有兩種寫法。
// 寫法一
if (typeof y === 'undefined') {
y = 'World';
}
// 寫法二
if (arguments.length === 1) {
y = 'World';
}ES6 允許為函數(shù)的參數(shù)設置默認值，即直接寫在參數(shù)定義的后面。
function log(x, y = 'World') {
console.log(x, y);
}
log('Hello') // Hello World
log('Hello', 'China') // Hello China
log('Hello', '') // Hello
可以看到，ES6 的寫法比 ES5 簡潔許多，而且非常自然。下面是另一個例子。
function Point(x = 0, y = 0) {
this.x = x;
this.y = y;
}
var p = new Point();
// p = { x:0, y:0 }
除了簡潔，ES6 的寫法還有兩個好處：首先，閱讀代碼的人，可以立刻意識到哪些參數(shù)是可以省略的，不用查看函數(shù)體或文檔；其次，有利于將來的代碼優(yōu)化，即使未來的版本徹底拿到這個參數(shù)，也不會導致以前的代碼無法運行。
默認值的寫法非常靈活，下面是一個為對象屬性設置默認值的例子。
fetch(url, { body = '', method = 'GET', headers = {} }){
console.log(method);
}
上面代碼中，傳入函數(shù) fetch 的第二個參數(shù)是一個對象，調用的時候可以為它的三個屬性設置默認值。
甚至還可以設置雙重默認值。
fetch(url, { method = 'GET' } = {}){
console.log(method);
}
上面代碼中，調用函數(shù) fetch 時，如果不含第二個參數(shù)，則默認值為一個空對象；如果包含第二個參數(shù)，則它的 method 屬性默認值為 GET。
定義了默認值的參數(shù)，必須是函數(shù)的尾部參數(shù)，其后不能再有其他無默認值的參數(shù)。這是因為有了默認值以后，該參數(shù)可以省略，只有位于尾部，才可能判斷出到底省略了哪些參數(shù)。
// 以下兩種寫法都是錯的
function f(x = 5, y) {
}
function f(x, y = 5, z) {
}
如果傳入 undefined，將觸發(fā)該參數(shù)等于默認值，null 則沒有這個效果。
function foo(x = 5, y = 6){
console.log(x,y);
}
foo(undefined, null)
// 5 null
上面代碼中，x 參數(shù)對應 undefined，結果觸發(fā)了默認值，y 參數(shù)等于 null，就沒有觸發(fā)默認值。
指定了默認值以后，函數(shù)的 length 屬性，將返回沒有指定默認值的參數(shù)個數(shù)。也就是說，指定了默認值后，length 屬性將失真。
(function(a){}).length // 1
(function(a = 5){}).length // 0
(function(a, b, c = 5){}).length // 2
上面代碼中，length 屬性的返回值，等于函數(shù)的參數(shù)個數(shù)減去指定了默認值的參數(shù)個數(shù)。
利用參數(shù)默認值，可以指定某一個參數(shù)不得省略，如果省略就拋出一個錯誤。
function throwIfMissing() {
throw new Error('Missing parameter');
}
function foo(mustBeProvided = throwIfMissing()) {
return mustBeProvided;
}
foo()
// Error: Missing parameter
上面代碼的 foo 函數(shù)，如果調用的時候沒有參數(shù)，就會調用默認值 throwIfMissing 函數(shù)，從而拋出一個錯誤。
從上面代碼還可以看到，參數(shù) mustBeProvided 的默認值等于 throwIfMissing 函數(shù)的運行結果（即函數(shù)名之后有一對圓括號），這表明參數(shù)的默認值不是在定義時執(zhí)行，而是在運行時執(zhí)行（即如果參數(shù)已經賦值，默認值中的函數(shù)就不會運行），這與 python 語言不一樣。
另一個需要注意的地方是，參數(shù)默認值所處的作用域，不是全局作用域，而是函數(shù)作用域。
var x = 1;
function foo(x, y = x) {
console.log(y);
}
foo(2) // 2
上面代碼中，參數(shù) y 的默認值等于 x，由于處在函數(shù)作用域，所以 x 等于參數(shù) x，而不是全局變量 x。
參數(shù)變量是默認聲明的，所以不能用 let 或 const 再次聲明。
function foo(x = 5) {
let x = 1; // error
const x = 2; // error
}
上面代碼中，參數(shù)變量 x 是默認聲明的，在函數(shù)體中，不能用 let 或 const 再次聲明，否則會報錯。
參數(shù)默認值可以與解構賦值，聯(lián)合起來使用。
function foo({x, y = 5}) {
console.log(x, y);
}
foo({}) // undefined, 5
foo({x: 1}) // 1, 5
foo({x: 1, y: 2}) // 1, 2
上面代碼中，foo 函數(shù)的參數(shù)是一個對象，變量 x 和 y 用于解構賦值，y 有默認值 5。
ES6 引入 rest 參數(shù)（形式為“...變量名”），用于獲取函數(shù)的多余參數(shù)，這樣就不需要使用 arguments 對象了。rest 參數(shù)搭配的變量是一個數(shù)組，該變量將多余的參數(shù)放入數(shù)組中。
function add(...values) {
let sum = 0;
for (var val of values) {
sum += val;
}
return sum;
}
add(2, 5, 3) // 10
上面代碼的 add 函數(shù)是一個求和函數(shù)，利用 rest 參數(shù)，可以向該函數(shù)傳入任意數(shù)目的參數(shù)。
下面是一個 rest 參數(shù)代替 arguments 變量的例子。
// arguments變量的寫法
const sortNumbers = () =>
Array.prototype.slice.call(arguments).sort();
// rest參數(shù)的寫法
const sortNumbers = (...numbers) => numbers.sort();上面代碼的兩種寫法，比較后可以發(fā)現(xiàn)，rest 參數(shù)的寫法更自然也更簡潔。
rest 參數(shù)中的變量代表一個數(shù)組，所以數(shù)組特有的方法都可以用于這個變量。下面是一個利用 rest 參數(shù)改寫數(shù)組 push 方法的例子。
function push(array, ...items) {
items.forEach(function(item) {
array.push(item);
console.log(item);
});
}
var a = [];
push(a, 1, 2, 3)
注意，rest 參數(shù)之后不能再有其他參數(shù)（即只能是最后一個參數(shù)），否則會報錯。
// 報錯
function f(a, ...b, c) {
// ...
}
函數(shù)的 length 屬性，不包括 rest 參數(shù)。
(function(a) {}).length // 1
(function(...a) {}).length // 0
(function(a, ...b) {}).length // 1
擴展運算符（spread）是三個點（...）。它好比 rest 參數(shù)的逆運算，將一個數(shù)組轉為用逗號分隔的參數(shù)序列。該運算符主要用于函數(shù)調用。
function push(array, ...items) {
array.push(...items);
}
function add(x, y) {
return x + y;
}
var numbers = [4, 38];
add(...numbers) // 42上面代碼中，array.push(...items)和add(...numbers)這兩行，都是函數(shù)的調用，它們的都使用了擴展運算符。該運算符將一個數(shù)組，變?yōu)閰?shù)序列。
下面是 Date 函數(shù)的參數(shù)使用擴展運算符的例子。
const date = new Date(...[2015, 1, 1]);由于擴展運算符可以展開數(shù)組，所以不再需要 apply 方法，將數(shù)組轉為函數(shù)的參數(shù)了。
// ES5的寫法
function f (x, y, z){}
var args = [0, 1, 2];
f.apply(null, args);
// ES6的寫法
function f (x, y, z){}
var args = [0, 1, 2];
f(...args);擴展運算符與正常的函數(shù)參數(shù)可以結合使用，非常靈活。
function f(v, w, x, y, z) { }
var args = [0, 1];
f(-1, ...args, 2, ...[3]);下面是擴展運算符取代 apply 方法的一個實際的例子，應用 Math.max 方法，簡化求出一個數(shù)組最大元素的寫法。
// ES5的寫法
Math.max.apply(null, [14, 3, 77])
// ES6的寫法
Math.max(...[14, 3, 77])
// 等同于
Math.max(14, 3, 77);上面代碼表示，由于 JavaScript 不提供求數(shù)組最大元素的函數(shù)，所以只能套用 Math.max 函數(shù)，將數(shù)組轉為一個參數(shù)序列，然后求最大值。有了擴展運算符以后，就可以直接用 Math.max 了。
另一個例子是通過 push 函數(shù)，將一個數(shù)組添加到另一個數(shù)組的尾部。
// ES5的寫法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
Array.prototype.push.apply(arr1, arr2);
// ES6的寫法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr1.push(...arr2);上面代碼的 ES5 寫法中，push 方法的參數(shù)不能是數(shù)組，所以只好通過 apply 方法變通使用 push 方法。有了擴展運算符，就可以直接將數(shù)組傳入 push 方法。
擴展運算符還可以用于數(shù)組的賦值。
var a = [1];
var b = [2, 3, 4];
var c = [6, 7];
var d = [0, ...a, ...b, 5, ...c];
d
// [0, 1, 2, 3, 4, 5, 6, 7]
上面代碼其實也提供了，將一個數(shù)組拷貝進另一個數(shù)組的便捷方法。
擴展運算符也可以與解構賦值結合起來，用于生成數(shù)組。
const [first, ...rest] = [1, 2, 3, 4, 5];
first // 1
rest // [2, 3, 4, 5]
const [first, ...rest] = [];
first // undefined
rest // []:
const [first, ...rest] = ["foo"];
first // "foo"
rest // []
const [first, ...rest] = ["foo", "bar"];
first // "foo"
rest // ["bar"]
const [first, ...rest] = ["foo", "bar", "baz"];
first // "foo"
rest // ["bar","baz"]
如果將擴展運算符用于數(shù)組賦值，只能放在參數(shù)的最后一位，否則會報錯。
const [...butLast, last] = [1, 2, 3, 4, 5];
// 報錯
const [first, ...middle, last] = [1, 2, 3, 4, 5];
// 報錯JavaScript 的函數(shù)只能返回一個值，如果需要返回多個值，只能返回數(shù)組或對象。擴展運算符提供了解決這個問題的一種變通方法。
var dateFields = readDateFields(database);
var d = new Date(...dateFields);上面代碼從數(shù)據(jù)庫取出一行數(shù)據(jù)，通過擴展運算符，直接將其傳入構造函數(shù) Date。
擴展運算符還可以將字符串轉為真正的數(shù)組。
[..."hello"]
// [ "h", "e", "l", "l", "o" ]任何類似數(shù)組的對象，都可以用擴展運算符轉為真正的數(shù)組。
var nodeList = document.querySelectorAll('div');
var array = [...nodeList];上面代碼中，querySelectorAll 方法返回的是一個 nodeList 對象，擴展運算符可以將其轉為真正的數(shù)組。
擴展運算符內部調用的是數(shù)據(jù)結構的 Iterator 接口，因此只要具有 Iterator 接口的對象，都可以使用擴展運算符，比如 Map 結構。
let map = new Map([
[1, 'one'],
[2, 'two'],
[3, 'three'],
]);
let arr = [...map.keys()]; // [1, 2, 3]Generator 函數(shù)運行后，返回一個遍歷器對象，因此也可以使用擴展運算符。
var go = function*(){
yield 1;
yield 2;
yield 3;
};
[...go()] // [1, 2, 3]
上面代碼中，變量 go 是一個 Generator 函數(shù)，執(zhí)行后返回的是一個遍歷器，對這個遍歷器執(zhí)行擴展運算符，就會將內部遍歷得到的值，轉為一個數(shù)組。
ES6 允許使用“箭頭”（=>）定義函數(shù)。
var f = v => v;上面的箭頭函數(shù)等同于：
var f = function(v) {
return v;
};如果箭頭函數(shù)不需要參數(shù)或需要多個參數(shù)，就使用一個圓括號代表參數(shù)部分。
var f = () => 5;
// 等同于
var f = function (){ return 5 };
var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
return num1 + num2;
};如果箭頭函數(shù)的代碼塊部分多于一條語句，就要使用大括號將它們括起來，并且使用return語句返回。
var sum = (num1, num2) => { return num1 + num2; }由于大括號被解釋為代碼塊，所以如果箭頭函數(shù)直接返回一個對象，必須在對象外面加上括號。
var getTempItem = id => ({ id: id, name: "Temp" });箭頭函數(shù)可以與變量解構結合使用。
const full = ({ first, last }) => first + ' ' + last;
// 等同于
function full( person ){
return person.first + ‘ ‘ + person.name;
}箭頭函數(shù)使得表達更加簡潔。
const isEven = n => n % 2 == 0;
const square = n => n * n;上面代碼只用了兩行，就定義了兩個簡單的工具函數(shù)。如果不用箭頭函數(shù)，可能就要占用多行，而且還不如現(xiàn)在這樣寫醒目。
箭頭函數(shù)的一個用處是簡化回調函數(shù)。
// 正常函數(shù)寫法
[1,2,3].map(function (x) {
return x * x;
});
// 箭頭函數(shù)寫法
[1,2,3].map(x => x * x);另一個例子是
// 正常函數(shù)寫法
var result = values.sort(function(a, b) {
return a - b;
});
// 箭頭函數(shù)寫法
var result = values.sort((a, b) => a - b);下面是 rest 參數(shù)與箭頭函數(shù)結合的例子。
const numbers = (...nums) => nums;
numbers(1, 2, 3, 4, 5)
// [1,2,3,4,5]
const headAndTail = (head, ...tail) => [head, tail];
headAndTail(1, 2, 3, 4, 5)
// [1,[2,3,4,5]]箭頭函數(shù)有幾個使用注意點。
上面三點中，第一點尤其值得注意。this 對象的指向是可變的，但是在箭頭函數(shù)中，它是固定的。下面的代碼是一個例子，將 this 對象綁定定義時所在的對象。
var handler = {
id: "123456",
init: function() {
document.addEventListener("click",
event => this.doSomething(event.type), false);
},
doSomething: function(type) {
console.log("Handling " + type + " for " + this.id);
}
};上面代碼的 init 方法中，使用了箭頭函數(shù)，這導致 this 綁定 handler 對象，否則回調函數(shù)運行時，this.doSomething 這一行會報錯，因為此時 this 指向全局對象。
由于 this 在箭頭函數(shù)中被綁定，所以不能用 call()、apply()、bind()這些方法去改變 this 的指向。
長期以來，JavaScript 語言的 this 對象一直是一個令人頭痛的問題，在對象方法中使用 this，必須非常小心。箭頭函數(shù)綁定 this，很大程度上解決了這個困擾。
箭頭函數(shù)內部，還可以再使用箭頭函數(shù)。下面是一個 ES5 語法的多重嵌套函數(shù)。
function insert(value) {
return {into: function (array) {
return {after: function (afterValue) {
array.splice(array.indexOf(afterValue) + 1, 0, value);
return array;
}};
}};
}
insert(2).into([1, 3]).after(1); //[1, 2, 3]上面這個函數(shù)，可以使用箭頭函數(shù)改寫。
let insert = (value) => ({into: (array) => ({after: (afterValue) => {
array.splice(array.indexOf(afterValue) + 1, 0, value);
return array;
}})});
insert(2).into([1, 3]).after(1); //[1, 2, 3]下面是一個部署管道機制（pipeline）的例子，即前一個函數(shù)的輸出是后一個函數(shù)的輸入。
const pipeline = (...funcs) =>
val => funcs.reduce((a, b) => b(a), val);
const plus1 = a => a + 1;
const mult2 = a => a * 2;
const addThenMult = pipeline(plus1, mult2);
addThenMult(5)
// 12如果覺得上面的寫法可讀性比較差，也可以采用下面的寫法。
const plus1 = a => a + 1;
const mult2 = a => a * 2;
mult2(plus1(5))
// 12箭頭函數(shù)可以綁定 this 對象，大大減少了顯式綁定 this 對象的寫法（call、apply、bind）。但是，箭頭函數(shù)并不適用于所有場合，所以 ES7 提出了“函數(shù)綁定”（function bind）運算符，用來取代 call、apply、bind 調用。雖然該語法還是 ES7 的一個提案，但是 Babel 轉碼器已經支持。
函數(shù)綁定運算符是并排的兩個雙引號（::），雙引號左邊是一個對象，右邊是一個函數(shù)。該運算符會自動將左邊的對象，作為上下文環(huán)境（即 this 對象），綁定到右邊的函數(shù)上面。
let log = ::console.log;
// 等同于
var log = console.log.bind(console);
foo::bar;
// 等同于
bar.call(foo);
foo::bar(...arguments);
i// 等同于
bar.apply(foo, arguments);箭頭函數(shù)還有一個功能，就是可以很方便地改寫 λ 微積分。
// λ微積分的寫法
fix = λf.(λx.f(λv.x(x)(v)))(λx.f(λv.x(x)(v)))
// ES6的寫法
var fix = f => (x => f(v => x(x)(v)))
(x => f(v => x(x)(v)));上面兩種寫法，幾乎是一一對應的。由于 λ 微積分對于計算機科學非常重要，這使得我們可以用ES6作為替代工具，探索計算機科學。
尾調用（Tail Call）是函數(shù)式編程的一個重要概念，本身非常簡單，一句話就能說清楚，就是指某個函數(shù)的最后一步是調用另一個函數(shù)。
function f(x){
return g(x);
}上面代碼中，函數(shù) f 的最后一步是調用函數(shù) g，這就叫尾調用。
以下兩種情況，都不屬于尾調用。
// 情況一
function f(x){
let y = g(x);
return y;
}
// 情況二
function f(x){
return g(x) + 1;
}上面代碼中，情況一是調用函數(shù) g 之后，還有別的操作，所以不屬于尾調用，即使語義完全一樣。情況二也屬于調用后還有操作，即使寫在一行內。
尾調用不一定出現(xiàn)在函數(shù)尾部，只要是最后一步操作即可。
function f(x) {
if (x > 0) {
return m(x)
}
return n(x);
}上面代碼中，函數(shù) m 和 n 都屬于尾調用，因為它們都是函數(shù) f 的最后一步操作。
尾調用之所以與其他調用不同，就在于它的特殊的調用位置。
我們知道，函數(shù)調用會在內存形成一個“調用記錄”，又稱“調用幀”（call frame），保存調用位置和內部變量等信息。如果在函數(shù) A 的內部調用函數(shù) B，那么在 A 的調用幀上方，還會形成一個 B 的調用幀。等到 B 運行結束，將結果返回到 A，B 的調用幀才會消失。如果函數(shù)B內部還調用函數(shù)C，那就還有一個 C 的調用幀，以此類推。所有的調用幀，就形成一個“調用棧”（call stack）。
尾調用由于是函數(shù)的最后一步操作，所以不需要保留外層函數(shù)的調用幀，因為調用位置、內部變量等信息都不會再用到了，只要直接用內層函數(shù)的調用幀，取代外層函數(shù)的調用幀就可以了。
function f() {
let m = 1;
let n = 2;
return g(m + n);
}
f();
// 等同于
function f() {
return g(3);
}
f();
// 等同于
g(3);上面代碼中，如果函數(shù) g 不是尾調用，函數(shù) f 就需要保存內部變量 m 和 n 的值、g 的調用位置等信息。但由于調用 g 之后，函數(shù)f就結束了，所以執(zhí)行到最后一步，完全可以刪除 f(x) 的調用幀，只保留 g(3) 的調用幀。
這就叫做“尾調用優(yōu)化”（Tail call optimization），即只保留內層函數(shù)的調用幀。如果所有函數(shù)都是尾調用，那么完全可以做到每次執(zhí)行時，調用幀只有一項，這將大大節(jié)省內存。這就是“尾調用優(yōu)化”的意義。
函數(shù)調用自身，稱為遞歸。如果尾調用自身，就稱為尾遞歸。
遞歸非常耗費內存，因為需要同時保存成千上百個調用幀，很容易發(fā)生“棧溢出”錯誤（stack overflow）。但對于尾遞歸來說，由于只存在一個調用幀，所以永遠不會發(fā)生“棧溢出”錯誤。
function factorial(n) {
if (n === 1) return 1;
return n * factorial(n - 1);
}
factorial(5) // 120上面代碼是一個階乘函數(shù)，計算 n 的階乘，最多需要保存 n 個調用記錄，復雜度 O(n) 。
如果改寫成尾遞歸，只保留一個調用記錄，復雜度 O(1) 。
function factorial(n, total) {
if (n === 1) return total;
return factorial(n - 1, n * total);
}
factorial(5, 1) // 120由此可見，“尾調用優(yōu)化”對遞歸操作意義重大，所以一些函數(shù)式編程語言將其寫入了語言規(guī)格。ES6 也是如此，第一次明確規(guī)定，所有 ECMAScript 的實現(xiàn)，都必須部署“尾調用優(yōu)化”。這就是說，在 ES6 中，只要使用尾遞歸，就不會發(fā)生棧溢出，相對節(jié)省內存。
尾遞歸的實現(xiàn)，往往需要改寫遞歸函數(shù)，確保最后一步只調用自身。做到這一點的方法，就是把所有用到的內部變量改寫成函數(shù)的參數(shù)。比如上面的例子，階乘函數(shù) factorial 需要用到一個中間變量 total ，那就把這個中間變量改寫成函數(shù)的參數(shù)。這樣做的缺點就是不太直觀，第一眼很難看出來，為什么計算 5 的階乘，需要傳入兩個參數(shù) 5 和 1？
兩個方法可以解決這個問題。方法一是在尾遞歸函數(shù)之外，再提供一個正常形式的函數(shù)。
function tailFactorial(n, total) {
if (n === 1) return total;
return tailFactorial(n - 1, n * total);
}
function factorial(n) {
return tailFactorial(n, 1);
}
factorial(5) // 120上面代碼通過一個正常形式的階乘函數(shù) factorial ，調用尾遞歸函數(shù) tailFactorial ，看起來就正常多了。
函數(shù)式編程有一個概念，叫做柯里化（currying），意思是將多參數(shù)的函數(shù)轉換成單參數(shù)的形式。這里也可以使用柯里化。
function currying(fn, n) {
return function (m) {
return fn.call(this, m, n);
};
}
function tailFactorial(n, total) {
if (n === 1) return total;
return tailFactorial(n - 1, n * total);
}
const factorial = currying(tailFactorial, 1);
factorial(5) // 120上面代碼通過柯里化，將尾遞歸函數(shù) tailFactorial 變?yōu)橹唤邮?1 個參數(shù)的 factorial 。
第二種方法就簡單多了，就是采用 ES6 的函數(shù)默認值。
function factorial(n, total = 1) {
if (n === 1) return total;
return factorial(n - 1, n * total);
}
factorial(5) // 120上面代碼中，參數(shù) total 有默認值 1，所以調用時不用提供這個值。
總結一下，遞歸本質上是一種循環(huán)操作。純粹的函數(shù)式編程語言沒有循環(huán)操作命令，所有的循環(huán)都用遞歸實現(xiàn)，這就是為什么尾遞歸對這些語言極其重要。對于其他支持“尾調用優(yōu)化”的語言（比如 Lua，ES6），只需要知道循環(huán)可以用遞歸代替，而一旦使用遞歸，就最好使用尾遞歸。
掃碼關注鍍金池微信號
手機訂課，優(yōu)惠多多