liroughriders.com记分板输入0显示短横线(-)问题咨询

问题出在liroughriders.com网站：赛事结束后录入比赛结果时，只要某支球队的比分为0，前端就会显示短横线，其余数字都能正常展示，目前临时用大写字母O替代0规避该问题。

这是非常典型的弱类型语言假值判断疏漏，属于改起来只要几行代码的小bug：

• 开发编写比分渲染逻辑时，图省事用了宽泛的假值判断来区分「未录入比分」和「已录入比分」的状态，基本是if(!score){显示短横线}这类写法。在JavaScript这类弱类型语言中，数字0会被判定为假值，和null、undefined、空字符串这些代表「比分未录入」的状态一起进入了显示短横线的分支，没有单独区分「比分为0」和「未录入比分」两种完全不同的业务状态。

找到比分渲染对应的代码段，把宽泛的假值判断改成精准的空值判断即可，修复成本极低：

• 会触发该bug的错误写法参考：

// 错误逻辑：0会被判定为假值，错误渲染为短横线
return score ? score : '-'

• 修复后的正确写法参考：

// 正确逻辑：仅当比分未填写（null/undefined/空字符串）时显示短横线
return (score === null || score === undefined || score === '') ? '-' : score

如果是在Vue、React等前端框架的模板中渲染，也要避免使用v-if="score"、{score || '-'}这类默认把0判定为假值的写法，替换成精准的空值判断即可。

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