JavaScript中的this关键字指代什么?这是很多开发者在学习过程中都会遇到的核心问题。this的指向并不是在代码编写阶段就固定下来的,而是取决于函数被调用的方式和当前的执行上下文,不同的调用场景会让this指向完全不同的对象。

this的五大绑定规则
JavaScript中this的指向主要遵循五类绑定规则,按照优先级从低到高依次为默认绑定、隐式绑定、显式绑定、new绑定,另外箭头函数有独立的指向逻辑。
1. 默认绑定
当函数独立调用,没有任何对象引用它时,会触发默认绑定。在非严格模式下,this默认指向全局对象,浏览器环境中是window,Node.js环境中是global;严格模式下this会指向undefined。
// 非严格模式示例
function defaultBindTest() {
console.log(this);
}
defaultBindTest(); // 浏览器中输出window,Node中输出global
// 严格模式示例
'use strict';
function strictDefaultTest() {
console.log(this);
}
strictDefaultTest(); // 输出undefined2. 隐式绑定
当函数作为某个对象的方法被调用时,this会指向这个调用它的对象,也就是函数前面的上下文对象。
const user = {
name: '张三',
sayName: function() {
console.log(this.name);
}
};
user.sayName(); // 输出张三,this指向user对象
// 隐式绑定丢失的情况
const sayNameFn = user.sayName;
sayNameFn(); // 输出空,此时函数独立调用,触发默认绑定,this指向全局3. 显式绑定
我们可以通过call、apply、bind方法手动指定函数内部this的指向,这就是显式绑定。
function showInfo(age) {
console.log(this.name + '年龄是' + age);
}
const person = { name: '李四' };
// call方法调用,第一个参数是this指向,后续是函数参数
showInfo.call(person, 20); // 输出李四年龄是20
// apply方法调用,第一个参数是this指向,第二个是参数数组
showInfo.apply(person, [22]); // 输出李四年龄是22
// bind方法返回新函数,永久绑定this指向
const boundFn = showInfo.bind(person, 25);
boundFn(); // 输出李四年龄是254. new绑定
当使用new关键字调用构造函数时,会创建一个新的对象实例,此时构造函数内部的this会指向这个新创建的实例对象。
function Person(name) {
this.name = name;
this.introduce = function() {
console.log('我是' + this.name);
};
}
const zhangsan = new Person('张三');
zhangsan.introduce(); // 输出我是张三,this指向zhangsan实例5. 箭头函数的特殊规则
箭头函数没有自己的this,它的this继承自外层最近的非箭头函数作用域,且一旦确定就不会再改变,也无法用call、apply、bind修改。
const obj = {
name: '王五',
normalFn: function() {
// 普通函数内部的箭头函数,this继承normalFn的this,也就是obj
const arrowFn = () => {
console.log(this.name);
};
arrowFn();
},
arrowFn: () => {
// 外层没有非箭头函数,this继承全局的this
console.log(this.name);
}
};
obj.normalFn(); // 输出王五
obj.arrowFn(); // 非严格模式下输出空,this指向全局对象绑定规则优先级
如果多个绑定规则同时适用,优先级从高到低为:new绑定 > 显式绑定 > 隐式绑定 > 默认绑定,箭头函数的优先级最高,因为它根本没有自己的this。
| 绑定类型 | 触发场景 | this指向 |
|---|---|---|
| 箭头函数 | 箭头函数调用 | 外层最近非箭头函数的this |
| new绑定 | new 构造函数 | 新创建的实例对象 |
| 显式绑定 | call/apply/bind调用 | 手动指定的对象 |
| 隐式绑定 | 对象方法调用 | 调用方法的上下文对象 |
| 默认绑定 | 独立函数调用 | 非严格模式全局对象,严格模式undefined |
常见误区提醒
- 不要认为this指向函数定义时的上下文,它只和调用方式有关
- 回调函数中的this很容易丢失隐式绑定,必要时可以用bind提前绑定
- 箭头函数不能用call、apply、bind修改this指向,这是很多开发者容易踩的坑
掌握this的指向规则后,就能在开发中准确判断this的指向,避免因为this指向错误导致的逻辑bug,写出更符合预期的JavaScript代码。
JavaScriptthis上下文绑定规则箭头函数修改时间:2026-06-05 01:58:51