JavaScript 中的 this 绑定规则在箭头函数和普通函数中有何不同？

普通函数的this在运行时根据调用方式动态绑定，遵循默认、隐式、显式和new绑定规则；箭头函数没有自己的this，继承外层作用域的this，且无法通过call、apply、bind改变，也不能作为构造函数使用。

JavaScript 中的 this 绑定在箭头函数和普通函数中存在本质区别，主要体现在作用域和绑定方式上。

普通函数有自己的 this 绑定

普通函数在执行时会根据调用方式动态确定 this 的值，遵循以下四种绑定规则：

• 默认绑定：独立调用时，非严格模式下指向全局对象（浏览器中是 window），严格模式下为 undefined
• 隐式绑定：通过对象调用时，this 指向该对象
• 显式绑定：使用 call、apply 或 bind 可以手动指定 this 值
• new 绑定：构造函数调用时，this 指向新创建的实例

这意味着普通函数的 this 是在运行时决定的，容易受到调用上下文的影响。

箭头函数没有自己的 this，继承外层作用域

箭头函数不会创建自己的 this 上下文，而是继承外层函数或全局作用域的 this 值。这种机制称为“词法 this”。

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

有道小P

有道小P，新一代AI全科学习助手，在学习中遇到任何问题都可以问我。

64

查看详情

由于箭头函数的 this 是定义时确定的，而不是运行时绑定的，因此它不受调用方式影响，也无法通过 call、apply 或 bind 修改 this 指向。

例如：

实际应用中的差异

在对象方法或事件回调中，这种差异尤为明显：

• 使用普通函数时，需注意 this 可能丢失，尤其是在异步操作或嵌套函数中
• 箭头函数常用于解决 this 指向问题，比如在 setTimeout、数组方法（map、filter）中保持外层 this
• 不能将箭头函数用作构造函数，因为它没有自己的 this，调用 new 会报错

基本上就这些。箭头函数简化了 this 的处理，但在需要动态绑定 this 的场景下，普通函数更合适。理解两者的差异有助于写出更可靠的代码。

以上就是JavaScript 中的 this 绑定规则在箭头函数和普通函数中有何不同？的详细内容，更多请关注php中文网其它相关文章！