箭头函数与普通函数在 this 绑定上的表现对比总结-js教程-PHP中文网

箭头函数不绑定this，继承外层作用域的this，无法通过call/apply/bind修改；普通函数this由调用方式动态决定，可作为构造函数。

箭头函数与普通函数在 this 绑定上的表现对比总结

箭头函数不绑定自己的 this，而是继承外层作用域的 this 值；普通函数则根据调用方式动态绑定 this，容易变化。

箭头函数：this 由定义时外层决定

箭头函数没有独立的 this，它会沿作用域链向上查找，使用最近一层普通函数或全局作用域中的 this。这意味着无论怎么调用，它的 this 都不会变。

不能用 call、apply、bind 修改 this
在对象方法中使用时，this 指向外层（比如构造函数或全局），不是当前对象
适合用在回调、事件处理器等需要保持外层 this 的场景

普通函数：this 由调用方式决定

普通函数的 this 在执行时才确定，取决于函数如何被调用。

Porkbun

一款AI工具，主要用于通过 API v3 管理 Porkbun DNS 记录和域名。用于在 Porkbun 上创建、读取、更新或删除 DNS 记录；列出域名；配置 API 访问；处理常见记录类型（A、AAAA、CNAME、MX、TXT 等）。该技能包含 CLI 工具 `scripts/porkbun-dns.js`，用于可靠执行 DNS 操作，适合需要提升相关任务效率的用户。

下载

直接调用（如 fn()）→ this 指向 undefined（严格模式）或 window（非严格模式）
作为对象方法调用（如 obj.fn()）→ this 指向该对象
用 call/apply/bind 调用 → this 显式指定为传入的第一个参数
构造函数调用（new Fn()）→ this 指向新创建的实例

常见陷阱对比

以下代码能清晰体现差异：

const obj = {
  name: 'Alice',
  regular() {
    console.log(this.name); // 'Alice'
    setTimeout(function() {
      console.log(this.name); // undefined（非严格模式下是 window）
    }, 100);
    setTimeout(() => {
      console.log(this.name); // 'Alice'，箭头函数继承 regular 的 this
    }, 100);
  }
};