将星级评分函数转为JavaScript箭头函数并优化循环实现

直接上可行方案，核心思路是创建一个长度等于总分的空数组，然后用map遍历每个位置生成对应星星，完美替代传统循环：

// 箭头函数版本，用Array.from + map实现
const ratingToStars = (ratingStr) => {
  // 拆分评分字符串，转成数字类型的得分和总分
  const [score, total] = ratingStr.split('/').map(Number);
  // 创建长度为总分的数组，遍历每个索引生成星星
  return Array.from({ length: total })
    .map((_, index) => index < score ? '★' : '☆')
    .join(' ');
};

// 测试用例
console.log(ratingToStars('3/5')); // 输出：★ ★ ★ ☆ ☆
console.log(ratingToStars('4/6')); // 输出：★ ★ ★ ★ ☆ ☆

细节说明： #

1. 生成指定长度的数组：Array.from({ length: total })可以快速创建一个长度为total的空数组，不需要手动填充内容，因为map只关心索引位置。
2. map遍历替代循环：map的第二个参数是当前元素的索引，通过判断索引是否小于得分，决定输出实心星还是空心星。
3. HTML实体适配：如果需要用HTML实体显示，把星星替换成对应实体即可：

const ratingToStars = (ratingStr) => {
  const [score, total] = ratingStr.split('/').map(Number);
  return Array.from({ length: total })
    .map((_, i) => i < score ? '&#9733;' : '&#9734;')
    .join(' ');
};

另外也可以用Array(total).fill().map(...)生成数组，效果和Array.from一致，本质都是通过数组方法模拟指定次数的循环，完全符合你的需求。

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