如何无需for循环实现JavaScript对象数组的结构转换？

当然可以，你可以利用JavaScript数组的高阶方法（如reduce）结合Object.values来完成转换，全程无需显式使用for循环。

实现代码 #

// 原始数据
const originalData = [
  { "browser": "Chrome", "count": 73, "verdict": "detected" },
  { "browser": "Opera", "count": 3, "verdict": "detected" },
  { "browser": "Chrome", "count": 3, "verdict": "blocked" },
  { "browser": "Edge", "count": 1, "verdict": "detected" }
];

// 用reduce分组并统计
const groupedData = originalData.reduce((accumulator, currentItem) => {
  // 如果当前浏览器还未在分组对象中，初始化默认结构
  if (!accumulator[currentItem.browser]) {
    accumulator[currentItem.browser] = {
      browser: currentItem.browser,
      detected: 0,
      blocked: 0
    };
  }
  // 给对应verdict字段赋值count
  accumulator[currentItem.browser][currentItem.verdict] = currentItem.count;
  return accumulator;
}, {});

// 将分组对象转为目标数组格式
const transformedData = Object.values(groupedData);

console.log(transformedData);

代码说明 #

• reduce方法遍历原始数据，按browser字段分组，自动处理重复的浏览器条目。
• 每个浏览器条目初始化时默认detected和blocked为0，确保没有对应verdict的字段也有默认值。
• 最后用Object.values将分组后的对象转换为数组，得到你需要的最终格式。

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