如何理解JavaScript中的This_它的绑定规则有哪些

JavaScript 中的 this 在函数执行时根据调用方式动态决定:默认绑定(非严格模式指向全局,严格模式为 undefined)、隐式绑定(obj.method() 中 this 指向 obj)、显式绑定(call/apply/bind 手动指定)、new 绑定(优先级最高,指向新实例)。

JavaScript 中的 this 不是写代码时就确定的,而是在函数**真正执行的那一刻**,根据**调用方式**动态决定的。它不取决于函数定义在哪,也不等于函数自身或外层作用域,只看“谁在调用它”。

默认绑定:最基础的兜底规则

当函数以最普通的方式被调用,既没挂对象上、也没用 new、call/apply/bind 时,就触发默认绑定:

  • 非严格模式下:this 指向全局对象(浏览器是 window,Node 是 global
  • 严格模式下:this 是 undefined(这是 ES5 设计的本意,防止意外污染全局)
  • 常见例子:function foo() { console.log(this); } foo(); —— 直接调用,走默认绑定

隐式绑定:对象点号调用时的自然指向

函数作为对象的属性被调用,比obj.method(),这时 this 自动绑定到该对象

  • 关键看调用位置是否有“上下文对象”,即紧挨着点号(.)或方括号([])的那个对象
  • 例如:const obj = { name: 'Alice', say() { console.log(this.name); } }; obj.say(); → 输出 Alice
  • 注意“隐式丢失”:把方法赋给变量再调用,const fn = obj.say; fn(); 就不再有对象上下文,退回到默认绑定

显式绑定:手动指定 this 的三种方式

通过 callapplybind 主动传入一个对象作为 this 值:

  • func.call(obj, a, b)func.apply(obj, [a, b]):立即执行,区别只在参数传法
  • const bound = func.bind(obj):返回一个新函数,this 被永久固定为 obj,后续调用无需再指定
  • 显式绑定优先级高于隐式绑定,但低于 new 绑定

new 绑定:构造函数调用时的特殊规则

new 调用函数时,会创建一个新对象,并把 this 绑定到这个新实例上:

  • 过程包括:新建空对象 → 原型链链接 → this 绑定 → 执行函数体 → 返回对象(除非显式 return 非空对象)
  • 例如:function Person(name) { this.name = name; } const p = new Person('Bob');p.name'Bob'
  • new 绑定优先级最高,即使函数已用 bind 固定 thisnew 仍会覆盖它