DEV Community
·
JavaScript中`this`的用法
💡
原文英文，约700词，阅读约需3分钟。
📝
内容提要
在JavaScript中，this关键字的值根据上下文变化：全局作用域指向全局对象，函数中非严格模式指向全局对象，严格模式下为undefined；方法中指向调用该方法的对象；箭头函数继承外部this；构造函数或类中指向新实例。可以通过call、apply和bind手动设置this的值。
🎯
关键要点
- this关键字的值根据执行上下文变化。
- 在全局作用域中，this指向全局对象。
- 在函数中，非严格模式下this指向全局对象，严格模式下为undefined。
- 在方法中，this指向调用该方法的对象。
- 箭头函数没有自己的this，继承外部作用域的this。
- 在构造函数或类中，this指向新创建的实例。
- 在事件处理程序中，this指向触发事件的元素。
- 可以通过call、apply和bind手动设置this的值。
- 当作为回调传递方法时，this可能会丢失上下文。
- 使用.bind()可以显式绑定this到正确的上下文。
- 注意不要过度使用箭头函数，特别是在对象方法中。
❓
延伸问答
JavaScript中this的值是如何变化的？
this的值根据执行上下文变化，包括全局作用域、函数、方法、箭头函数、构造函数和事件处理程序等。
在全局作用域中，this指向什么？
在全局作用域中，this指向全局对象，在浏览器中是window，在Node.js中是一个空的全局对象。
严格模式下，函数中的this是什么？
在严格模式下，函数中的this为undefined。
箭头函数中的this是如何工作的？
箭头函数没有自己的this，它会继承外部作用域的this。
如何手动设置this的值？
可以使用call、apply和bind方法手动设置this的值。
在事件处理程序中，this指向什么？
在事件处理程序中，this指向触发事件的元素。
➡️
