一、function預設參數 二、rest參數 三、擴展運算符 四、箭頭函數 具有詞法作用域的 this this問題 第二種方法是用bind(this),即 但現在我們有了箭頭函數，就不需要這麼麻煩了： ...
一、function預設參數
現在可以在定義函數的時候指定參數的預設值了，而不用像以前那樣通過邏輯或操作符來達到目的了。
es5
function sayHello(name){
//傳統的指定預設參數的方式
let name1 = name||'hubwiz';
return 'Hello'+name1;
}
運用ES6的預設參數
function sayHello2(name='hubwiz'){
return `Hello ${name}`;
}
function sayHello3(name='張三',age=19){
return `大家好，我叫${name},今年${age}歲`+'\n' +"大家好，我叫"+name+",今年"+age;
}
console.log(sayHello());//輸出：Hello hubwiz
console.log(sayHello('匯智網')); //輸出：Hello 匯智網
console.log(sayHello2()); //輸出：Hello hubwiz
console.log(sayHello2('匯智網'));
console.log(sayHello3());//輸出：Hello 匯智網
console.log(sayHello3('nick',26));
二、rest參數
rest參數（形式為“...變數名”）可以稱為不定參數，用於獲取函數的多餘參數，這樣就不需要使用arguments對象了。
rest參數搭配的變數是一個數組，該變數將多餘的參數放入數組中。
function add(...values) {
console.log(...values);//1 2 3
console.log(values);//[1,2,3]
let sum = 0;
for (var val of values) {
sum += val;
}
return sum;
}
console.log(add(1, 2, 3));
不定參數的格式是三個句點後跟代表所有不定參數的變數名。比如以上示例中，...values 代表了所有傳入add函數的參數。
三、擴展運算符
擴展運算符（spread）是三個點（...）。它好比rest參數的逆運算，將一個數組轉為用逗號分隔的參數序列。該運算符主要用於函數調用。
它允許傳遞數組或者類數組直接做為函數的參數而不用通過apply。
let people=['張三','李四','王五'];
//sayHello函數本來接收三個單獨的參數people1，people2和people3
function sayHello4(people1,people2,people3){
console.log(`Hello ${people1},${people2},${people3}`);
}
//但是我們將一個數組以拓展參數的形式傳遞，它能很好地映射到每個單獨的參數
sayHello4(...people); //輸出：Hello 張三,李四,王五
//而在es5，如果需要傳遞數組當參數，我們需要使用函數的apply方法
sayHello4.apply(null,people); //輸出：Hello 張三,李四,王五
四、箭頭函數
箭頭函數是使用=>語法的函數簡寫形式。這在語法上與 C#、Java 8 和 CoffeeScript 的相關特性非常相似
let array = [1, 2, 3];
//傳統寫法
array.forEach(function(v) {
console.log(v);
});
//ES6
array.forEach(v => console.log(v));
//它們同時支持表達式體和語句體。與（普通的）函數所不同的是，箭頭函數和其上下文中的代碼共用同一個具有詞法作用域的this。
let evens = [1,2,3,4,5];
let fives = [];
// 表達式體
let odds = evens.map(v => v + 1);
let nums = evens.map((v, i) => v + i);
let pairs = evens.map(v => ({even: v, odd: v + 1}));
// 語句體
nums.forEach(v => {
if (v % 5 === 0){
fives.push(v);
}
});
console.log(fives);
具有詞法作用域的 this
let bob = {
_name: "NICK",
_friends: ["Amy", "Bob", "Cinne", "Dylan", "Ellen"],
printFriends() {
this._friends.forEach(f => console.log(this._name + " knows " + f));
}
}
bob.printFriends();
例子：
es6
(x, y) => {x++; y--; return x+y};
相當於es5
function test(x, y) {
x++;
y--;
return x + y;
}
this問題
class Animal {
constructor(){
this.type = 'animal'
}
says(say){
setTimeout(function(){
console.log(this.type + ' says ' + say)
}, 1000)
}
}
var animal = new Animal()
animal.says('hi') //undefined says hi
運行上面的代碼會報錯，這是因為setTimeout中的this指向的是全局對象。所以為了讓它能夠正確的運行，傳統的解決方法有兩種：
第一種是將this傳給self,再用self來指代this
function says(say) {
var self = this;
setTimeout(function () {
console.log(self.type + ' says ' + say)
}, 1000)
}
第二種方法是用bind(this),即
function says(say){
setTimeout(function(){
console.log(this.type + ' says ' + say)
}.bind(this), 1000)
}
但現在我們有了箭頭函數，就不需要這麼麻煩了：
class Animal2 {
constructor(){
this.type = 'animal'
}
says(say){
setTimeout( () => {console.log(this);
console.log(this.type + ' says ' + say)
}, 1000)
}
}
var animal2 = new Animal2();
animal2.says('hi') ; //animal says hi
箭頭函數有幾個使用註意點。
1.函數體內的this對象，即綁定定義時所在的對象，而不是使用時所在的對象。
並不是因為箭頭函數內部有綁定this的機制，實際原因是箭頭函數根本沒有自己的this，它的this是繼承外面的，因此內部的this就是外層代碼塊的this。
2.不可以當作構造函數，也就是說，不可以使用new命令，否則會拋出一個錯誤。
3.不可以使用arguments對象，該對象在函數體內不存在。
上面三點中，第一點尤其值得註意。this對象的指向是可變的，但是在箭頭函數中，它是固定的。
此篇終，待續……
