浅浅的分析下es6箭头函数
前言
箭头函数作为es6重点的语法内容之一，很多开发者对其爱不释手，当也要注意其可能存在的问题，其正确的使用场景，否则会引起不必要的bug。
语法
//场景1 没有参数,空的小括号，返回值不用加 return，也就是说支持单一表达式,如果加return 需要构成语句
var demo=()=>5675;
//场景2 ：只有一个参数 ,小括号省略
var demo=num1=>5675;
//场景3：有多个参数
var demo=（num1，num2)=>5675;
//场景 4 ：有多个参数 ，并且需要语句块
var demo=(num1,num2)=>{
if(num1<num2){
return num1
}else{
return 2
}
}
//场景5 ：需要返回的为对象时需要两队花括号来区分对象以及本身的语句块
var demo=()={{
name:1,
version:2
}}特点
无this
箭头函数不会创建自己的this；它使用封闭执行上下文的this值。
适用场景
以下逻辑参考《你不知道的js》,请根据自己的需要进行选择是否使用箭头函数。
简单的理解上面的逻辑图大概就是这样的几个前提： 1 确定参数是固定的，没有默认值，没有rest参数收集器，如果有的话 ，也可以用一对小括号来归纳，对于整个团队你的参数是明显可知可控的。 2 简单的流式逻辑图，没有过多的逻辑或者业务判断 3 方法体比较简单，只是单个或者简单的表达语句 4 返回值是比较简单的基本数据类型，如果是对象需要额外的大括号，其他的返回内容也是额外注意的，无论哪种请保证你的返回值是明确的、可读的。
不适用场景
定义对象方法
一般情况下如果想定义对象下的函数，是多少涉及使用对象中的其他属性的，如果用箭头函数会因为对象无法形成作用域，没有相关上下文，导致this指向全局。特别需要说明的一点是，如果你对象属性方法中需要定义方法，同时想使用对象属性，那么此时建议使用箭头函数。代码参考如下：
- 字面直接量
let person={
name:'zhangsan',
say1:()=>{
console.log(this.name)
},
say2:function(){
console.log(this.name)
},
say3:function(){
return ()=>{
console.log(this.name)
}
},
say4:function(){
return function(){
console.log(this.name)
}
}
}
person.say1()//全局
person.say2()//对象
person.say3()()//对象
person.say4()()//全局- 原型对象
function animal(){
this.name='animal'
}
animal.prototype.run=()=>{
console.log('animal：'+this.name)
}
animal.prototype.run2=function(){
console.log('animal：'+this.name)
}
var dog=new animal();
dog.run()//codepen
dog.run2()//animal定义事件的回调事件
此时用this唤起的是全局对象，而用传统方式是获取到的事件元素。
var btn=document.getElementById("btn"),
btn2=document.getElementById("btn2");
btn.addEventListener("click",function(){
console.log(this)
})
btn2.addEventListener("click",()=>{
console.log(this)
})构造器函数
因为箭头函数无法形成作用域，所以在实例化的时候构造器会失败，不能使用箭头函数实现构造器，真实的使用会报错。
let bird=()=>{
console.log(this)
}
let xique=new bird()//bird is not a constructor逻辑判断过于复杂
这时候逻辑过于复杂使用箭头函数会导致代码结构不清楚，建议使用原始的结构。 比如以下场景： 1 业务或者语法判断过于复杂 2 返回值情况很复杂
建议
尽管箭头函数和let、const以及一些es6语法变得风行，甚至于有些人觉得用箭头函数就觉得自己的技术进阶了，其实不然，大多人人还是停留在了它写法上的便利，并没有了解好其真正的使用场景。
总之，个人的建议是：上面提到的几种不适合的场景不要用箭头函数。箭头函数适用于那些参数业务逻辑以及返回值都简单的方法的实现。它本质我个人认为就是一段函数的简化写法，最大的利好在于传递了当前对象，避免了之前很多类似于var that=this ,self = this的写法。
参考文档
腾讯云开发者
