JavaScript箭头函数详解及与普通函数区别

本篇文章向大家介绍《JavaScript箭头函数是什么？与普通函数区别详解》，主要包括，具有一定的参考价值，需要的朋友可以参考一下。

箭头函数是JavaScript中语法更简洁但行为不同的函数形式，不绑定this而继承外层this、无arguments对象、不可作为构造函数、无prototype和super，适用于短小无状态回调。

箭头函数是 JavaScript 中定义函数的简洁语法，用 => 符号替代 function 关键字。它不只是写法更短，更关键的是行为逻辑与普通函数有本质差异——尤其在 this 绑定、arguments、构造调用等方面。

箭头函数没有自己的 this

普通函数的 this 取决于调用方式（如对象方法、call/apply、事件回调等），而箭头函数不绑定自己的 this，而是**继承外层作用域的 this 值**，且无法通过 call、bind 或 apply 改变。

• 适合用在回调中避免 var self = this 或 .bind(this) 的写法
• 不能用作对象方法（若需动态 this，必须用普通函数）
• Vue、React 等框架中常用于事件处理或生命周期回调，保持上下文一致

箭头函数没有 arguments 对象

普通函数内部可访问类数组对象 arguments 获取所有实参；箭头函数没有 arguments，只能靠剩余参数（...args）替代。

• 写 (...args) => console.log(args) 是安全且现代的做法
• 若代码依赖 arguments.callee（如递归匿名函数），箭头函数完全不支持

箭头函数不能作为构造函数使用

箭头函数没有 prototype 属性，调用时若加 new 会直接报错：TypeError: xxx is not a constructor。

• 所有需要实例化的类或工厂逻辑，必须用普通函数或 class
• 意味着箭头函数天然不可被 new，也无 new.target

箭头函数没有原型和 super（在类中）

普通函数有 prototype，可用于模拟类；箭头函数没有，也不能在对象方法简写中用 super（因为不是“方法”，只是属性值为函数）。

• 对象里写 method: () => this.x —— 这不是“方法”，只是带函数值的属性
• 无法在子类中用 super.xxx() 调用父类同名箭头函数（它根本不在原型链上）

基本上就这些。箭头函数不是普通函数的“升级版”，而是语义不同的工具：适合写短小、无状态、依赖外层上下文的逻辑；涉及 this 动态性、构造、重写或调试需求时，普通函数仍是唯一选择。

到这里，我们也就讲完了《JavaScript箭头函数详解及与普通函数区别》的内容了。个人认为，基础知识的学习和巩固，是为了更好的将其运用到项目中，欢迎关注golang学习网公众号，带你了解更多关于的知识点！