JS中“无我”的=>箭头函数？

在ES6中，允许使用“箭头”（=>）定义函数
首先我们来看看它是怎么定义函数的

定义函数

var sum = (num1,num2) => num1 + num2;
//相当于
var sum = function(num1,num2){
     return num1 + num2;
} ;

哦哦，原来箭头函数是定义函数的一种简化方法，它省去了function、return这样的单调乏味且罗里吧嗦的关键字，使代码一下子变得很清爽

• 注意

如果箭头函数代码块里面不至一条语句时，需要用大括号把它们包起来，并使用return返回

那箭头函数的作用就这点吗？远远不是

箭头函数解决了this绑定问题

这才是箭头函数的灵魂所在，我们先来看个例子

var man = {
    name:'chuichui',
    sing:function(){
        setTimeout(function(){console.log(this.name,'is singing');},100)      
    }
}
var name= 'wangcai';
man.sing(); // "wangcai is singing"

在setTimeout中延迟执行，怎么就变成了旺财在唱歌呢？
这里面其实都是this搞得鬼
原来setTimeout中所执行函数中的this，指向全局对象 而全局对象中name变量的值为"wangcai"
如果变成箭头函数，情况就有点不一样了

var man = {
    name:'chuichui',
    sing:function(){
        setTimeout(() =>{console.log(this.name,'is singing');},100)      
    }
}
var name= 'wangcai';
man.sing(); // "chuichui is singing"

这是因为普通函数this指向运行时所在的作用域，第一个例子中作用域是（全局对象）；箭头函数中的this绑定了定义时所在的作用域，第二个例子中作用域是sing函数，这样使箭头函数可以让this指向固定化**

实质

this指向固定化其实并不是箭头函数内部有绑定this机制，实际上箭头函数根本没有自己的this，这样导致内部的this就是外部代码的this，这样就实现了固定化

感受?

果然无招胜有招，“无我”才是最高境界，箭头兄，

最后 ?

好啦，以上就是我本次分享的全部内容啦，如果你觉得我的文章对你有一丢丢帮助，那么请不要吝啬你的赞?哦，阿门~