React状态结构挑战中三元运算符统计逻辑异常问题

你遇到的问题核心是JavaScript运算符优先级导致的逻辑错误：

加法运算符+的优先级高于三元条件运算符?:，所以你写的return acum + cur.packed ? 1 : 0会先执行acum + cur.packed，再把这个计算结果作为三元判断的条件：

• 如果计算结果是「真值」（比如0+1=1、1+0=1、1+1=2等），就返回1
• 只有当计算结果是「假值」（比如0+0=0）才会返回0

这就导致不管循环多少次，最终返回的都是1，完全偏离了累加统计的逻辑。

修正后的三元运算符代码 #

只需要给三元运算的部分加上括号，让它先计算出要累加的数值（1或0），再和acum相加：

const packed = items.reduce((acum, cur, i) => {
  console.log(`Index: ${i}, packed: ${cur.packed}, Before:${acum}, Addition: ${cur.packed ? 1 : 0}`);
  return acum + (cur.packed ? 1 : 0);
}, 0);

逻辑对比 #

你的if-else代码逻辑是正确的：

• 当cur.packed为true时，返回acum + 1
• 否则返回原acum

修正后的三元运算符代码和这个逻辑完全一致，就能正确统计packed为true的物品数量了。

内容的提问来源于stack exchange，提问作者W. Xiaoyun