箭头函数无this、不能new、无arguments、不支持yield、不可bind/call/apply、无prototype、参数不可重复；用于对象方法、组件handler、事件绑定、构造函数等场景会出错。
箭头函数没有自己的 this，这点必须时刻绷着弦
箭头函数不绑定 this，它会沿作用域链向上找外层函数的 this。这意味着在对象方法、事件回调、定时器中直接用箭头函数，this 往往不是你期待的那个对象。
常见错误现象：
const obj = {
name: 'Alice',
regularFn() {
console.log(this.name); // 'Alice'
},
arrowFn: () => {
console.log(this.name); // undefined（this 指向全局或 undefined）
}
};
obj.regularFn(); // ✅
obj.arrowFn(); // ❌
- 对象方法定义不用箭头函数（
method() { ... }或method: function() { ... }） - Vue/React 组件方法、生命周期钩子中避免用箭头函数声明 handler，否则拿不到组件实例的
this - 给 DOM 元素绑事件时，若需访问触发元素（
e.currentTarget或this），别用箭头函数——它让this失效
箭头函数不能用作构造函数，new 会直接报错
箭头函数没有 prototype，也没有 [[Construct]] 内部方法，所以无法被 new 调用。
错误信息：TypeError: xxx is not a constructor
- 需要实例化（比如封装工具类、配置类）时，必须用
function声明或class -
React.memo或React.forwardRef的参数函数也不能是箭头函数（它们内部会尝试以构造方式调用） - 想在函数内用
new.target判断是否被new调用？箭头函数里压根访问不到new.target
没有 arguments 对象，也拿不到 caller/callee
箭头函数体内访问 arguments，得到的是外层函数的 arguments，不是当前函数的。ES6 之后推荐用剩余参数 ...args，但如果你在写兼容性代码或需要动态读取实参长度/内容（比如实现柯里化、代理函数），就得小心。
立即学习“Java免费学习笔记（深入）”；
示例：
function outer() {
const arrow = () => console.log(arguments[0]); // 指向 outer 的 arguments
arrow('oops'); // 输出 outer 调用时的第一个参数，不是 'oops'
}
- 需要透传所有参数给另一个函数（如装饰器、日志包装）时，普通函数 +
arguments或显式剩余参数更可控 - 使用
bind、call、apply改变执行上下文？箭头函数无视这些调用方式——它this和arguments都“冻结”在外层了
没有原型、不能用 yield，也不支持重复参数名
这些限制大多属于“用了就报错”，但容易在迁移旧代码或快速重构时踩坑：
- 定义生成器函数？
function*是唯一选择，箭头函数不支持yield - 需要检查
fn.prototype（比如某些库靠它判断是否可实例化）？箭头函数的prototype是undefined - 函数参数含重复名（如
(a, a) => {}）在严格模式下会报SyntaxError；普通函数在非严格模式下允许，但箭头函数一律不允许
真正容易被忽略的，是「箭头函数看起来更短，就下意识替换所有 function」——结果在 Vue 方法、React 事件、类实例方法、需要 arguments 的工具函数里悄悄埋雷。它不是语法糖，是语义不同的函数类型。
