ECMAScript 6（ES6） 特性概览和与ES5的比较3-箭头函数

1.表达体

更具表现力的闭包语法
ECMAScript 6

odds = evens.map(v => v+1) //返回一个表达式
pairs = evens.map(v => ({even: v, odd: v + 1})) //返回一个对象，需要加()
nums = evens.map((v, 1) => v + i)//两个参数，需要加()

ECMAScript 5

odds = evens.map(function (v) {return v+1;});
pairs = evens.map(function (v) {return { even: v, odd: v + 1};});
nums = evens.map(function (v,i) {return v + i;});

2.声明式函数体

更具表现力的闭包语法，加花括号{}
ECMAScript 6

nums.forEach(v=>{
  if(v % 5 === 0)
     five.push(v) 
})

ECMAScript 5

nums.forEach(function(v){
  if(v % 5 === 0)
     five.push(v); 
});

3. this

更直观地处理当前对象上下文
ECMAScript 6

this.nums.forEach((v)=>{
   if(v % 5 ===0)
      this.fives.push(v)
})
//比如vue项目中的写法

ECMAScript 5

//第一种写法
var self = this;
this.nums.forEach(function (v) {
     if (v % 5 === 0)
         self.fives.push(v);
})
//第二种写法
this.nums.forEach(function (v) {
     if (v % 5 === 0)
         this.fives.push(v);
},this)
//第三种写法
this.nums.forEach(function (v) {
     if (v % 5 === 0)
         this.fives.push(v);
}.bind(this));