JavaScript中如何详细解析this关键字指向之谜？

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

前言：相信我，只要记住以下7个步骤口诀，就能彻底掌握JS中的this指向。

先记口诀：箭头函数、new、bind、apply 和 call、obj.（对象方法）、直接调用、不在函数内。

按口诀顺序：箭头函数、new、bind、apply 和 call、obj.（对象方法）、直接调用、不在函数内。

前言

相信我，只要记住本文的 7️⃣ 步口诀，就能彻底掌握 JS 中的 this 指向。

先念口诀：箭头函数、new、bind、apply 和 call、欧比届点（obj.）、直接调用、不在函数里。

按照口诀的顺序，只要满足前面某个场景，就可以确定 this 指向了。

接下来按照口诀顺序对它们进行详解，文中示例代码都运行在 Chrome 的 Console 控制台中。

文末有精心准备的练习题，用于检验学习成果，别忘了试试~

1. 箭头函数

箭头函数排在第一个是因为它的 this 不会被改变，所以只要当前函数是箭头函数，那么就不用再看其他规则了。

箭头函数的 this 是在创建它时外层 this 的指向。这里的重点有两个：

1. 创建箭头函数时，就已经确定了它的 this 指向。
2. 箭头函数内的 this 指向外层的 this。