ES6語法

1.var const let 區別

var的作用域是方法作用域，在方法外無法通過var定義的變數

const的作用域和let的作用域相同，是塊作用域，只要出在同一個{}內都是可以被訪問到的，兩者的主要差別是const一旦被賦值就不再被改變，在vue中大部分情況下會用const，除非知道該變數值會改變。

2.箭頭函式

//es5
var fn  = function(a,b){
    return a + b;
}
//es6箭頭函式寫法，當函式直接被return時，可以省略函式體的括號
const fn = (a,b) => a + b;
//es5
var foo = function(){
  var a=20;
  var b=30;
  return a+b;
}
//es6
const foo=()=>{
    const a = 20;
    const b = 20;
    return a + b;
}
值得一提的是，箭頭函式中沒有this，所以要使用時儘量避免使用箭頭函式，否則容易出現undefined
 

3.引數的預設值

當函式的引數沒有傳遞值會使用預設值，在es6中預設值的指定語法變得非常簡單
//es5
function add(x,y){
   var x  = x || 20;
   var y  = y || 30;
   return x + y;
}
//es6
function add(x=20,y=30){
   return x + y;
}

4.展開運算子

const arr1 = [1,2,3];
const arr2 = [...arr1,10,20,30];
//這樣，arr2變成了[1,2,3,10,20,30];
在不知道Props有多少資料傳遞過來，用展開運算子即可解決

5.省略字面量

//es6
const person = {
   name,
   age
}
//es5
var person = {
  name:name,
  age:age
};