箭头函数的 this 在定义时就绑定外层作用域的 this,不随调用方式改变,不响应 call/apply/bind,也不参与动态绑定规则;其 this 由词法作用域决定,与执行位置无关。

箭头函数的 this 不是运行时决定的,而是在定义那一刻就“定格”了外层作用域的 this 值,不随调用方式改变。
箭头函数没有自己的 this 绑定
它不参与 JavaScript 的 this 动态绑定规则(如隐式、显式、new 或默认绑定),也不响应 call、apply、bind 的干预。只要函数体里用了 this,它就直接沿用紧邻外层普通函数或全局作用域的 this 值。
- 如果定义在全局,this 就是 window(非严格模式)或 undefined(严格模式)
- 如果定义在某个对象方法内部,this 就继承该方法执行时的 this(通常是那个对象)
- 如果定义在类的方法中,this 指向当前实例——因为外层方法的 this 已被构造过程绑定为实例
词法作用域决定一切
决定箭头函数能访问哪个 this 的,不是它在哪被调用,而是它写在哪。JS 引擎在解析代码时就记录下它所在位置的词法上下文,之后无论怎么传递、嵌套、延迟执行,这个 this 都不会变。
- 赋值给变量再调用:仍保持原上下文的 this
- 作为定时器回调:记住的是定义时的 this,不是 setTimeout 触发时的
- 放在事件监听器里:this 指向外层函数的 this,不是触发事件的 DOM 元素
与普通函数的本质区别
普通函数每次执行都要根据调用方式重新确定 this;箭头函数只在创建时做一次“快照”,后续完全忽略调用现场。
- obj.method() 中的普通函数:this → obj
- obj.method() 中的箭头函数:this → method 执行时的 this(也就是 obj)
- const fn = obj.method; fn() 中的普通函数:this → window / undefined
- const fn = obj.method; fn() 中的箭头函数:this → 依然还是 obj(因为 method 内部定义的箭头函数捕获的是 method 的 this)
常见误用场景提醒
容易出错的地方往往出现在对“定义位置”判断不清时:
- 在类顶层直接写箭头函数属性(如 increment = () => { ... }):this 指向实例,安全
- 在类中用普通方法,再在方法里定义箭头函数:this 继承该方法当时的上下文
- 用箭头函数做 DOM 事件处理器:this 不会指向 event.target,而是外层作用域的 this
- 试图用 bind 修改箭头函数的 this:无效,语法允许但无实际效果
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











