箭头函数可在三元运算符中作分支返回值，单表达式无需括号，多语句或返回对象时必须用小括号包裹整个函数以避免语法错误。

箭头函数可以在条件运算符（三元运算符）中直接作为分支的返回值，但需注意括号包裹和语法合法性——尤其当箭头函数含多条语句或需显式返回对象字面量时，容易出错。

基本写法：单表达式箭头函数可直接使用

若箭头函数体是单一表达式（无花括号），可直接写在三元运算符的分支位置：

const fn = condition ? () => console.log('yes') : () => console.log('no');
fn(); // 根据 condition 执行对应函数

这种写法简洁安全，因为 () => ... 本身是合法表达式，能被三元运算符完整接收。

含代码块时必须用括号包裹整个箭头函数

如果某个分支需要多语句箭头函数（即带花括号的函数体），必须用小括号将其整体包住，否则会因语法解析错误而报错：

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

JavaStoryDevelop

你接手一个需求时，是不是经常这样："改一个小字段 → 结果把不相关的代码也改了"、"需求说得很模糊 → 做着做着发现跑偏了"、"数据库加个字段 → 上线才发现漏了数据兼容"、"做了个新功能 → 一个月后自己都忘了当时怎么设计的"、"写到一半被中断 → 再回来不知道从哪继续"；这个 Skill 就是专门解决这些问题的。 它会自动探测你的项目环境（JDK、Spring Boot、ORM、数据库、前端框架），记在

下载

• ❌ 错误写法（缺少外层括号）：condition ? () => { console.log(1); return 2; } : () => 0 —— JavaScript 会把 { 当作三元运算符的代码块起始，导致语法错误
• ✅ 正确写法：condition ? (() => { console.log(1); return 2; }) : (() => 0)

括号告诉解析器：这是一个完整的函数表达式，不是语句块。

返回对象字面量要小心隐式返回陷阱

箭头函数若想隐式返回一个对象字面量，必须用括号包裹对象，否则大括号会被解析为函数体：

• ❌ () => { a: 1 } → 这是带标签语句的函数体，不返回对象，且 a: 1 是无效标签语句
• ✅ () => ({ a: 1 }) → 括号强制解析为表达式，正确返回对象
• 在三元中同样适用：cond ? () => ({ x: 1 }) : () => ({ y: 2 })

实际应用示例：根据条件返回不同行为的函数

常见于配置化逻辑，比如事件处理器或 API 调用封装：

const fetchData = isMock 
  ? (() => Promise.resolve({ data: 'mock' })) 
  : (() => fetch('/api/data').then(r => r.json()));

fetchData().then(console.log);

这里两个分支都返回一个“调用后返回 Promise 的函数”，类型一致，可安全赋值与后续调用。