JavaScript箭头函数与词法作用域-js教程-PHP中文网

JavaScript箭头函数与词法作用域

夢幻星辰

发布： 2025-10-24 09:25:02

原创

397人浏览过

箭头函数通过词法绑定继承外层this，避免了运行时this指向的不确定性。例如在setTimeout中使用箭头函数可正确访问对象属性，而普通函数会丢失this绑定。箭头函数无自身this、arguments，不能作为构造函数，适用于回调等需保持外层作用域的场景，但不适用于需要动态this或arguments的传统用法。

javascript箭头函数与词法作用域

JavaScript中的箭头函数不仅简化了函数的写法，还改变了this的绑定方式。它不创建自己的this上下文，而是继承外层作用域的this值，这种行为体现了词法作用域的核心思想。

箭头函数的this绑定

普通函数中的this是在运行时动态决定的，取决于函数如何被调用。而箭头函数的this是词法绑定，也就是说它由定义时所处的环境决定。

例如，在对象方法中使用箭头函数：

const user = {
  name: 'Alice',
  greet: function() {
    setTimeout(() => {
      console.log('Hello, ' + this.name); // 正确输出 Alice
    }, 100);
  }
};
user.greet();

登录后复制

这里的箭头函数捕获了greet方法中的this，也就是user对象。如果使用普通函数，this会指向全局对象或undefined（严格模式），导致无法访问name属性。

立即学习“Java免费学习笔记（深入）”；