求解释JavaScript reduce中括号代花括号、加逗号省return的语法原理
该简写写法的核心语法原理
整个写法能正常运行,本质是用到了两个JS基础语法的特性,没有任何特殊封装:
1. 箭头函数的体简写规则
- 当箭头函数后面用花括号
{}包裹函数体时,这部分是语句块作用域,JS引擎不会自动返回任何值,必须通过显式return语句指定要返回的内容,这也是你最早写的常规计数逻辑的运行基础。 - 当箭头函数后面没有花括号时,后面跟的内容会被识别为单个可求值的表达式,这个表达式的计算结果会被自动作为函数的返回值,不需要额外写
return。这种模式下函数体不能写多行独立语句,必须把多步操作打包成单个合法表达式才能正常运行。
2. 逗号运算符的计算逻辑
JS中的逗号,是专门用来拼接多个表达式的运算符,计算规则非常固定:
- 从左到右依次执行逗号分隔的每一段代码
- 把最右侧表达式的计算结果,作为整个逗号表达式的最终返回值
- 执行左侧代码产生的副作用(比如对象修改、变量赋值)会正常生效,不会被丢弃
你看到的括号包裹的表达式(acc[val] = (acc[val] || 0) + 1, acc),就是一个标准的逗号表达式:
- 先执行左侧的赋值逻辑:给累计对象
acc的对应key做计数累加,完成对对象内容的修改 - 左侧操作执行完后,执行逗号右侧的
acc,把这个修改后的累计对象作为整个表达式的返回值
因为整个结构是一个合法的单个表达式,刚好匹配箭头函数省略花括号时“自动返回表达式结果”的规则,所以最终reduce拿到的累计值,和带显式return的常规写法运行结果完全一致。
注意:这种写法非常容易漏写逗号后的
acc——如果漏写,函数就会返回左侧赋值操作的结果(也就是累加后的数字),reduce的累计值会从对象被替换成数字,直接出现逻辑错误。
另外你示例里的数组有个语法小笔误:'a''a'属于JS相邻字符串隐式拼接,实际运行会生成值为'aaa'的元素,修正后才是预期的重复字符统计效果,不影响对写法原理的理解。
内容的提问来源于stack exchange,提问作者saul t.
相关产品推荐
相关产品推荐

