箭头函数是ES6引入的简洁语法,无this/arguments/super/new.target,不能作构造函数;this继承外层作用域,无arguments需用...args,单表达式可隐式返回,但加{}须显式return。

箭头函数是 ES6 引入的简洁写法,核心特点是没有自己的 this、arguments、super 或 new.target,且不能用作构造函数。它和普通函数的区别不是“好不好”,而是“适不适合”——关键看你要不要绑定上下文、要不要 arguments 对象、要不要 new 调用。
this 指向固定,不随调用方式改变
普通函数的 this 由调用时的上下文决定(比如 obj.fn() 中 this 是 obj,单独调用 fn() 中 this 是全局或 undefined);而箭头函数的 this 始终继承自外层作用域(定义时所在函数的 this),不会被 call、apply、bind 改变,也不会因事件绑定或定时器丢失。
常见场景:在 setTimeout、事件监听、数组方法(如 map、filter)里避免手动 bind(this) 或写 var self = this。
- ✅ 推荐:obj.arr.map(x => this.handle(x)) —— this 自动指向外层对象
- ❌ 避免:obj.arr.map(function(x) { return this.handle(x); }.bind(this))
没有 arguments 对象,也不支持 rest 参数替代(但可用 ...args)
箭头函数内部访问 arguments 会报错,因为它根本没有这个绑定。如果需要获取参数,必须显式使用 rest 参数(...args)。
立即学习“Java免费学习笔记(深入)”;
- 普通函数中:function sum() { return Array.from(arguments).reduce((a,b) => a+b); }
- 箭头函数中:const sum = (...args) => args.reduce((a,b) => a+b, 0);
不能作为构造函数,没有 prototype
用 new 调用箭头函数会直接报错 TypeError。它没有 prototype 属性,也不能被 instanceof 判断。所以类、工厂函数、需要实例化的场景必须用 function 或 class。
- ✅ const Person = class { constructor(name) { this.name = name; } };
- ❌ const Person = (name) => ({ name }); // new Person('Alice') → 报错
简写语法更紧凑,但隐式返回有陷阱
单参数可省括号,单表达式可省大括号和 return;但一旦加了大括号,就必须显式写 return,否则返回 undefined。
- ✅ x => x * 2
- ✅ (x, y) => x + y
- ✅ x => ({ value: x }) // 注意小括号包裹对象字面量,避免被解析成代码块
- ❌ x => { value: x } // 返回 undefined,因为 { } 被当成了函数体
基本上就这些。用箭头函数,图的是语义清晰、this 稳定、写法轻量;该用普通函数的时候——比如要动态 this、要 arguments、要 new 出来——别硬套箭头函数,不复杂但容易忽略细节。











