JavaScript中this由函数调用时的上下文决定,谁调用就指向谁;普通调用时非严格模式指向全局对象、严格模式为undefined;对象方法调用时指向该对象;call/apply/bind可显式绑定;new调用时指向新实例;箭头函数无this,继承外层。

JavaScript 中的 this 不是由函数定义时决定的,而是由**函数调用时的上下文**决定的——换句话说,谁调用它,this 就指向谁(除非被显式绑定或处于特殊模式)。
普通函数调用时的 this 指向全局或 undefined
在非严格模式下,直接调用函数(如 foo()),this 指向全局对象(浏览器中是 window);严格模式下则为 undefined。
常见错误现象:在回调、定时器或事件处理中丢失 this,比如:
const obj = {
name: 'Alice',
say() { console.log(this.name); }
};
setTimeout(obj.say, 100); // 输出 undefined(严格模式)或 window.name
原因:这里 obj.say 被取出来单独调用,等价于 const fn = obj.say; fn();,调用者不再是 obj。
立即学习“Java免费学习笔记(深入)”;
对象方法调用时 this 指向调用者
当函数作为对象属性被调用(即 obj.method() 形式),this 指向该对象。
但要注意「赋值即脱钩」:
const obj = { x: 42, f() { return this.x; } };
const ref = obj.f;
ref(); // this 是全局或 undefined,不是 obj
- 只有「点号左侧的对象」才影响
this,括号前的表达式决定了调用者 -
(obj.f)()和obj.f()行为一致;但(obj.f = obj.f)()或(0, obj.f)()会丢失绑定
call/apply/bind 显式控制 this
这三个方法允许你手动指定函数执行时的 this 值。
-
fn.call(obj, arg1, arg2):立即执行,参数逐个传入 -
fn.apply(obj, [arg1, arg2]):立即执行,参数以数组形式传入 -
fn.bind(obj, arg1):返回一个新函数,this永久绑定为obj,后续调用不再改变
注意:bind 绑定不可逆,即使再对返回函数调用 call 也无法覆盖原始绑定(除非用 new 调用)。
构造函数和 new 调用时的 this 指向新实例
使用 new Foo() 调用函数时,this 指向新创建的空对象,并且该对象隐式继承 Foo.prototype。
关键细节:
- 如果构造函数显式返回一个对象,则
this实例被丢弃,返回该对象;返回原始值(如return 42)则忽略,仍返回新实例 - 箭头函数不能用作构造函数,调用
new会报TypeError: xxx is not a constructor - ES6 类的
constructor内部this也遵循同样规则
真正容易被忽略的是「调用位置」的隐蔽性:比如事件监听器中的 this 是触发元素,但 Promise 回调里的 this 取决于外层;嵌套函数、解构赋值、高阶函数都可能悄悄改变调用方式。别依赖“看起来像对象方法”,盯住括号前的那个表达式是谁。











