JavaScript箭头函数中this的绑定机制是怎样的？

本文共计1609个文字，预计阅读时间需要7分钟。

前言：箭头函数极大简化了this的取值规则。

+ 箭头函数与普通函数 +普通函数指的是使用function关键字定义的函数：var hello=function () { console.log(Hello, Fundebug!); };箭头函数指的是使用箭头语法定义的函数：var hello=()=> { console.log(Hello, Fundebug!); };

前言

箭头函数极大地简化了this的取值规则。

普通函数与箭头函数

普通函数指的是用function定义的函数：

var hello = function () { console.log("Hello, Fundebug!"); }

箭头函数指的是用=>定义的函数：

var hello = () => { console.log("Hello, Fundebug!"); }

JavaScript箭头函数与普通函数不只是写法上的区别，它们还有一些微妙的不同点，其中一个不同点就是this。

箭头函数没有自己的this值，箭头函数中所使用的this来自于函数作用域链。

这句话很简单，不过听着稍微有点莫名其妙，得从头说起。

this到底是什么？

关于this的文章也够多了，有时候越描越黑，我就不再添乱了，我只负责搬运一下MDN文档：this，感兴趣的可以仔细阅读一下，我摘录一些最重要的话就好了。