箭头函数不绑定this,继承外层第一个普通函数的this;普通函数的this由调用方式决定:obj.method()指向obj,独立调用时严格模式为undefined、非严格模式为globalThis,call/bind可显式绑定。

箭头函数不绑定自己的 this,它会沿作用域链向上查找外层普通函数的 this 值;而普通函数的 this 由调用方式决定。混合嵌套时,关键不是“嵌套层级”,而是“每个函数是否为箭头函数”以及“最近的非箭头函数的 this 是什么”。
普通函数:this 由调用位置决定
普通函数(function 关键字或方法定义)的 this 在运行时绑定,取决于它被如何调用:
-
obj.method() →
this指向 obj - func()(独立调用)→ 严格模式下为 undefined,非严格模式下为 globalThis
-
fn.call(obj) 或 fn.bind(obj) →
this显式绑定为 obj
箭头函数:继承外层第一个普通函数的 this
箭头函数没有自己的 this,它会捕获其**定义时所在词法作用域中、最近的一个普通函数的 this 值**(不是调用时的 this):
- 如果外层没有普通函数(比如直接在全局/模块顶层),则
this是 globalThis(浏览器中是 window) - 如果外层是普通函数 A,A 的
this是 obj,那么 A 内部所有箭头函数的this都是 obj —— 即使箭头函数嵌套多层(如 A → 箭头1 → 箭头2 → 箭头3),它们共享同一个this - 箭头函数内部再定义的普通函数,会重新根据调用方式确定自己的
this,不影响外层箭头函数的this
混合嵌套的典型场景与判断步骤
遇到 function 和 => 混用时,按以下顺序分析:
- 从目标函数出发,向外逐层查看其直接外层函数
- 找到第一个非箭头函数(即普通函数),它的
this就是当前箭头函数的this - 如果是普通函数,则跳过箭头函数,看它自己是如何被调用的
- 注意:bind/call/apply 对箭头函数无效,因为箭头函数的
this是词法绑定、不可重写
一个直观例子
const obj = {
name: 'Alice',
regular() {
console.log('regular this:', this.name); // Alice
const arrow1 = () => {
console.log('arrow1 this:', this.name); // Alice(继承 regular 的 this)
const arrow2 = () => {
console.log('arrow2 this:', this.name); // Alice(仍继承 regular 的 this)
};
arrow2();
};
arrow1();
const innerFunc = function() {
console.log('innerFunc this:', this.name); // undefined(独立调用)
const arrow3 = () => console.log('arrow3 this:', this.name); // undefined(继承 innerFunc 的 this)
arrow3();
};
innerFunc(); // 注意:这里没用 call/bind,所以 this 是 undefined
}
};
obj.regular();
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











