vue-箭头函数的使用和this的指向

　　平时在script标签或JS文件定义一个函数是这样的：

const fn = function(){
  consolo.log("")  
}

　　如果是在对象字面量中定义函数的话，有如下两种方式：

const fn = {
  fn1: function(){},
  fn2(){}    
}

　　而在ES6中又引入了一种对函数的定义方式：箭头函数，标准示例如下：

const jiantou = (num1,num2) => {
  console.log(num1+num2)
  return num+num2    
}

　　上面的（num1+num2）是参数列表，后面的{ }是方法体；但主要说的并不是这种方式，他还有特别的写法：

　　当只有一个参数，方法体中的代码只有一行时，他可以下面的写法：

const jiantou = num => num

　　上面代码意思是：参数是num，方法体是return num；做一个总结：当参数只有一个时，（）是可以省去的(无参是不可以省去的)，当方法体只有一行代码时，{}是可以省去的，并且记住这行代码实际上前面会跟上一个return的，但很多人在想，那我这个函数没有返回值，他返回什么呢？那他返回就是一个undefined

　　说完箭头函数，再说一下箭头函数中的this和普通定义的函数中this有什么区别吧，看到下面的代码：

　　当我们调用obj.add()函数时，function()中的this指向的是window对象；而箭头函数指向的是obj，这是怎么回事呢？

　　对于function()中的this，指向的是最外层的对象，即 window

　　而箭头函数中的this他是指向的最近作用域的对象，也就是说最近调用它的对象，在上面的例子，obj就是最近调用它的对象

vue-箭头函数的使用和this的指向

推荐阅读