ES6 箭頭函式

講到 ES6 就不能不知道箭頭函式，它可以讓我們的函式變得更簡短、提升可讀性，但其實蠻多眉眉角角的，以下就提供幾個寫法範例&特性說明！

特色簡介

1. 寫法為 () => {}
2. 參數只有一個時，可以省略小括號 ()
3. 省略大括號 {} 的話，代表直接 return 第一行程式碼
4. 如果返回值或參數有包含 {} ，需要在外圍加上括號 ()
5. 如果有多行程式，需要加上大括號 {}

原本的函式寫法

function sayHi() {
  console.log('Hello 你好阿');
}
sayHi(); //Hello 你好阿

箭頭函式的寫法

// 正常寫法
var sayHi = (name) => {
  return name + '你好哇'
}
console.log(sayHi('阿華'))

如果程式碼只有一行，可以省略大括號 {}，會直接 return 第一行程式碼

var sayHi = (name) => name + '你好哇'
console.log(sayHi('阿華')); // 阿華你好哇

只有一個參數可以不加小括號()

var sayHi = name => name + '你好哇'
console.log(sayHi('阿華')); // 阿華你好哇

沒有參數或兩個參數以上時，一定要有小括號()

var sayHi = () => '阿華你好哇'
console.log(sayHi()); // 阿華你好哇

var sayHi = (name1,name2) => name1 + name2 + '你好哇'
console.log(sayHi('阿華','萱萱')); // 阿華萱萱你好哇

如果程式碼有多行時，一定要使用大括號{}將它們括起來，並且使用 return 返回

let getYear = () => {
    let date = new Date();
    return date.getFullYear();
}
console.log(getYear()); // 2019

如果要直接 return 物件，必須在物件外面加上括號()，否則會報錯。

// 出現錯誤
let myHome = () => { dog: 1, brother: "豪豪" };

// 正確寫法
let myHome = () => ({ dog: 1, brother: "豪豪" });

ESLint airbnb 箭頭函式規則

• 8.1 當你必須使用函式表達式或傳遞一個匿名函式時，請使用箭頭函式
• 8.2 如果函式只使用一行，可以省略大括號{}，使用隱藏的回傳
• 8.3 如果函式跨了多行，請包在大括號{}中，增加可讀性
• 8.4 如果函式只使用一個參數，省略小括號()
• 8.5 避免使用比較運算子（<=、>=）造成混淆

參考文章
卡斯伯：箭頭函式 (Arrow functions)
鹹魚：箭頭函數 Arrow Function