如何正确使用三元（问号式if-else）判定评分分支：解决0评分不显示无提示的问题

• 原有三元判断的条件选取错误：当前判断绑定的是userObj.Skills字段的存在性，仅校验用户技能数据是否存在，完全没有和实际计算得到的评分值做关联
• 边界场景覆盖缺失：预期中评分为0的场景本应触发无评分提示，但现有逻辑只要userObj.Skills存在，不管计算得到的totalRating是多少，都会直接走评分展示分支，哪怕评分为0也不会切换到提示逻辑
• 原有评分计算逻辑存在冗余：reduce初始值已经传了数字0，不需要在累加过程中对total做重复的parseFloat转换，反而可能带来不必要的类型异常

1. 先优化评分计算逻辑，提前处理空评价数组的除零边界，保证最终输出的totalRating是纯数字值，不存在NaN的异常情况

   // 空评价数组直接返回0，避免除以0长度数组产生计算异常
   const totalRating = Ratings.length
     ? Ratings.reduce((total, rating) => total + (parseFloat(rating.skillset_rating) || 0), 0) / Ratings.length
     : 0;
   

2. 调整三元判断的核心条件，把「存在大于0的有效评分」作为展示评分组件的触发前提，无有效评分时自动切到提示分支

   <div className="user_rating_review">
     <span className="user_rating_data_name">Reviews:</span>
     {
       // 仅当评分大于0时渲染星级组件，否则展示无评分提示
       totalRating > 0 ?
       <div className="review_rating_star">
           <Rating value={totalRating} precision={0.5} readOnly max={5} className="user_rating_found" />
           <span className="user_total_rating">{totalRating}</span>/5
       </div>
       : <div className="review_unspecified">Not enough rating yet</div>
     }
   </div>
   

• 调整后的逻辑可以自动覆盖所有无有效评分的场景：不管是没有任何评价导致评分为0，还是所有评价的打分为0，都会触发提示分支，完全匹配预期效果
• 如果业务上需要同时校验用户的技能数据存在性，可以把判断条件调整为userObj.Skills && totalRating > 0，两个条件同时满足才展示评分，既保留原有字段的校验，也补上评分有效性的判断
• 原代码里用|| 0做totalRating兜底的逻辑可以保留，避免计算异常导致页面渲染报错

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