箭头函数不绑定自己的this,而是继承外层最近普通函数的this值;无法通过call/apply/bind修改,定义时就确定,适合事件回调等需保持上下文的场景。

箭头函数不绑定自己的 this,而是直接继承外层作用域(词法作用域)中最近的非箭头函数的 this 值。
箭头函数没有独立的 this 绑定
普通函数调用时,this 由调用方式决定(如 obj.fn() 中 this 指向 obj);但箭头函数内部没有 this 绑定机制,它会沿作用域链向上查找,取外层第一个普通函数(或全局作用域)的 this 值。
- 即使通过
.call()、.apply()或.bind()显式传入this,箭头函数也无视这些操作 - 在全局作用域中定义的箭头函数,其
this指向全局对象(浏览器中是window,严格模式下为undefined)
常见继承场景:对象方法内定义箭头函数
当箭头函数写在对象方法(普通函数)内部时,它继承该方法执行时的 this:
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
const obj = {
name: 'Alice',
regularFn() {
// 这里 this 指向 obj
const arrow = () => console.log(this.name); // 继承 regularFn 的 this → 'Alice'
arrow();
}
};
obj.regularFn(); // 输出 'Alice'
- 注意:如果把箭头函数赋值给对象属性(如
arrow: () => ...),它外层没有普通函数,this就继承自全局作用域,不是obj - 因此,箭头函数不适合作为对象的方法直接挂载
定时器和事件回调中的典型用法
箭头函数常用于避免 this 失去指向:
立即学习“Java免费学习笔记(深入)”;
const button = document.getElementById('btn');
const handler = {
name: 'ClickHandler',
init() {
// 普通函数作为事件监听器时,this 会变成 button
button.addEventListener('click', function() {
console.log(this === button); // true
console.log(this.name); // undefined(button 没有 name)
});
// 箭头函数继承 init() 调用时的 this(即 handler)
button.addEventListener('click', () => {
console.log(this.name); // 'ClickHandler',因为继承了 init 的 this
});
}
};
- 关键点:箭头函数的
this在定义时就确定了,与后续如何调用无关 - 所以它天然适合做回调,尤其在需要访问当前对象上下文时
嵌套多层时的继承规则
箭头函数逐层向外找,直到遇到第一个普通函数(或全局):
function outer() {
console.log('outer this:', this); // { id: 1 }
function middle() {
console.log('middle this:', this); // 同上
const inner = () => {
console.log('inner this:', this); // 仍为 { id: 1 },继承 middle 的 this
};
inner();
}
middle.call({ id: 1 });
}
- 只要中间没有其他箭头函数打断,继承链就持续有效
- 如果中间某层也是箭头函数,它会继续向上找,跳过所有箭头函数

















