箭头函数没有自己的this，继承外层作用域的this；不能用作构造函数，无prototype和arguments；简写语法需注意对象字面量要加括号；适合短回调，不适用于需动态this或复杂逻辑的场景。
箭头函数没有自己的 this，它继承外层作用域的 this
这是最常踩坑的地方。普通函数的 this 取决于调用方式（如 obj.method() 中 this 指向 obj），而箭头函数根本不绑定 this，它直接沿作用域链向上找外层函数的 this。
典型错误场景：
- 在对象方法中用箭头函数：
const obj = { name: 'a', fn: () => console.log(this.name) }→this指向全局或undefined（严格模式），不是obj - 事件回调里想访问实例：
button.addEventListener('click', () => this.handleClick())→ 如果写在类方法里，this是类实例；但如果写在全局，就不是
箭头函数不能用作构造函数，也没有 prototype 和 arguments
它没有 [[Construct]] 内部方法，所以不能被 new 调用，否则报错：TypeError: xxx is not a constructor。
同时：
立即学习“Java免费学习笔记（深入）”；
- 没有
arguments对象 —— 用剩余参数...args替代 - 没有
prototype属性 ——ArrowFn.prototype是undefined - 不能用
yield，不支持生成器语法
简写语法省略 return 和花括号只适用于单表达式
这是写错逻辑的高发区。以下写法看似简洁，实则隐含返回值：
const add = (a, b) => a + b; // ✅ 返回 a + b
const obj = (a, b) => ({ a, b }); // ✅ 注意括号：必须包一层小括号，否则被解析为代码块
const broken = (a, b) => { a, b }; // ❌ 代码块，无 return，返回 undefined常见误判点：
- 想返回对象字面量却忘了外层
()，结果返回undefined - 用大括号但没写
return，以为会隐式返回，实际不会 - 多语句必须显式写
return，且要用{}
箭头函数适合做短小的回调，不适合替代所有函数声明
它不是“更现代的函数”，而是有明确设计意图的语法糖：简化无状态、无 this 绑定需求的函数表达式。
该用箭头函数的场景：
array.map(x => x * 2)setTimeout(() => doSomething(), 100)- React 函数组件内定义事件处理器（确保
this指向正确）
不该用的场景：
- 需要动态
this的方法（如 Vue 方法、类原型方法） - 需要
arguments或new实例化的函数 - 函数体复杂、需调试、需命名（箭头函数是匿名的，堆栈中显示为
anonymous）
真正容易被忽略的是：箭头函数的「词法 this」是静态的 —— 它在定义时就锁定了外层 this 值，哪怕之后外层 this 改变，它也不会变。这个特性既强大又危险，用前得确认外层作用域是否稳定。
