JavaScript箭头函数无花括号if逻辑 无需三元且支持自定义返回值

• 箭头函数省略花括号的写法，主体位置仅支持单个合法的JS表达式，不支持if、for、while这类流程控制语句结构，这是JS语法的硬性约束，也是两次报错的根本原因。
• 只要主体是合法表达式，箭头函数可以返回任意类型的值，不存在“只能返回布尔值”的限制。

• 直接把原生if语句写到无花括号的箭头函数主体里是不可行的，因为if属于流程控制语句，不属于表达式范畴，放到表达式位置必然触发语法错误。
• 可以通过短路逻辑与运算符&&实现完全等效的单分支if逻辑，全程不需要三元运算符，且主体是纯表达式，完全符合无花括号的语法要求：
  • 运行原理：&&是表达式级别的运算符，当左侧条件为真值时，会返回右侧操作数的具体值；当左侧条件为假值时，直接短路返回左侧假值，刚好匹配“条件满足就返回指定值，不满足就返回假值”的单if逻辑。
  • 原带花括号代码的等效简化写法：

    console.log([1, 2, 3, 4].every(value => value > 0 && 1))
    

    运行输出和原版本完全一致，为true。
• 注意：如果if分支内存在多步操作、额外副作用，无法用单个表达式描述，就必须给箭头函数加上花括号，切回语句主体的写法，没有其他语法捷径。

• 之前的代码报错不是因为箭头函数不能返回非布尔值，而是因为判断结果val>0和字符串"awesome"之间没有合法的表达式运算符连接，形成了“相邻值无操作符”的语法错误，解析器无法识别两个内容的组合关系。
• 无花括号的箭头函数本身完全支持返回任意类型的自定义值：字符串、数字、对象、函数等都可以，只要把要返回的内容放到合法表达式的最终求值结果位置即可。
• 原报错代码的修正后写法（无需三元运算符）：

  k = val => val > 0 && "awesome"
  console.log(k(2)) // 输出 "awesome"
  console.log(k(-2)) // 输出 false
  

  这里箭头函数返回的是自定义字符串，不是布尔值，完全符合自定义返回的需求。

内容的提问来源于stack exchange，提问作者Indratej Reddy