严格模式下普通函数独立调用时this为undefined,需主动控制this值:用call/apply/bind显式绑定、箭头函数继承外层this、避免方法提取后调用,并在类中通过bind或字段箭头函数处理回调。

在严格模式下,普通函数独立调用时 this 默认为 undefined,而不是非严格模式下的全局对象(如 window 或 globalThis)。这不是“丢失”,而是设计行为——它让 this 的绑定更明确、更可预测。要解决由此引发的报错或逻辑异常,关键不是“修复丢失”,而是**主动控制 this 的值**。
明确绑定 this:使用 call、apply 或 bind
这是最直接、最可控的方式。当函数需要特定上下文执行时,显式传入 this 值:
-
func.call(obj, arg1, arg2)—— 立即执行,this指向obj -
func.apply(obj, [arg1, arg2])—— 同上,参数以数组形式传入 -
const bound = func.bind(obj)—— 返回新函数,永久绑定this为obj
例如:
const user = { name: 'Alice' };function greet() { return `Hello, ${this.name}`; }
greet(); // TypeError: Cannot read property 'name' of undefined(严格模式)
greet.call(user); // "Hello, Alice"
改写为箭头函数(仅适用于需继承外层 this 的场景)
箭头函数不绑定自己的 this,而是沿作用域链向上查找。如果函数本就该用外层对象的 this(比如类方法中回调),可用箭头函数替代普通函数:
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
name: 'Bob',
init() {
setTimeout(() => console.log(this.name), 100); // 正确输出 'Bob'
}
};
⚠️注意:箭头函数不能用于需要动态 this 的场合(如作为事件处理器并期望 this 指向 DOM 元素),也不可被 call/bind 改变 this。
在对象方法中调用时,避免“提取后调用”
常见陷阱是把方法赋值给变量再调用,导致 this 脱离原对象:
const fn = obj.getValue;
fn(); // undefined(严格模式)
解决方式有三种:
- 调用时用
obj.getValue()(保持点号调用) - 用
bind预绑定:const fn = obj.getValue.bind(obj); - 用箭头函数包装:
const fn = () => obj.getValue();
构造函数与类方法:默认安全,但需注意回调传递
ES6 类中的方法默认是普通函数,若作为回调传入(如 addEventListener、setTimeout),仍会丢失 this。推荐做法:
- 在 constructor 中绑定:
this.handleClick = this.handleClick.bind(this); - 使用类字段语法(箭头函数):
handleClick = () => { ... }; - 在调用处内联绑定:
button.addEventListener('click', () => this.handleClick());
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南










