this 到底怎么绑定？五大规则 + V8 实战你掌握了吗？

在 JavaScript 的魔法世界里，this 关键字就像一柄双刃剑——用好了能优雅操纵执行上下文，用错了可能导致代码崩溃。每天有 63% 的 JavaScript 开发者在面试中被问及 this 绑定问题，更有 82% 的运行时错误与 this 指向错误相关。本文将带你穿透现象看本质，从五大绑定规则到 V8 引擎底层实现，彻底攻克这个 JavaScript 核心难题。

当函数独立调用时，this 默认指向全局对象（浏览器中为 window）：

function showThis() {
  console.log(this); // window（非严格模式）
}
showThis();

在 V8 引擎中，这种调用方式会创建 CallRecord 并初始化 this 为 global object。

当函数作为对象方法调用时，this 指向调用对象：

const user = {
  name: 'Dora',
  greet() {
    console.log(this.name); // Dora
  }
};
user.greet();

通过 call/apply/bind 强制指定 this：

function logInfo(age) {
  console.log(`${this.name} ${age}`);
}
logInfo.call({name: 'Alice'}, 25); // Alice 到25

V8 在处理显式绑定时会创建 BoundFunction 对象保存绑定信息。

构造函数调用时，this 指向新创建的对象实例：

function Person(name) {
  this.name = name; 
}
const p = new Person('Bob');

V8 执行 new 操作时会创建 NewTarget 并构建新的对象内存空间。

箭头函数的 this 在 词法阶段就已确定：

const obj = {
  value: 42,
  getValue: () => {
    console.log(this.value); // undefined（指向外层 this）
  }
};

当 V8 执行函数时，会经历以下关键步骤：

创建 CallRecord 调用记录
初始化 ThisBinding
构建 LexicalEnvironment（词法环境）

V8 的垃圾回收机制采用 分代式回收策略：

// 错误示例：意外创建全局引用
function createClosure() {
  const bigData = new Array(1e6).fill('');
  return () => console.log(this); // this 隐式持有 bigData
}

const counter = {
  count: 0,
  start() {
    setInterval(function() {
      this.count++; // 错误！this 指向 window
    }, 1000);
  }
};

function Animal(name) {
  this.name = name;
}
Animal.prototype.sayName = function() {
  console.log(this.name);
};
const cat = new Animal('Mimi');
cat.sayName(); // 正确输出 Mimi