如何在JavaScript的map函数中去除重复值？尝试方案未生效

需要遍历给定的JSON数据，输出不重复的name字段值，当前代码会输出重复内容，尝试过用Set但方法错误，求可行解决方案。

给定JSON数据 #

"results": [
    {
        "data": {
            "labels": {
                "results": [
                    {
                        "name": "tom"
                    }
                ]
            }
        }
    },
    {
        "data": {
            "labels": {
                "results": [
                    {
                        "name": "jerry"
                    }
                ]
            }
        }
    },
    {
        "data": {
            "labels": {
                "results": [
                    {
                        "name": "tom"
                    }
                ]
            }
        }
    }
]

当前代码 #

obj.results.map((items) => {
    if (items.data.labels.results.length) {
        items.data.labels.results.map((result) => {
            console.log(result.name);
        });
    }
});

当前输出 #

tom
jerry
tom

期望输出 #

tom
jerry

已尝试但无效的方案 #

obj.results.map((items) => {
    if (items.data.label.results.length) {
        items.data.label.results.map((result) => {
            console.log(Array.from(new Set(result.name)));
        });
    }
});

该方案输出 #

[ 't', 'o', 'm' ]
[ 'j', 'e', 'r', 'r', 'y' ]
[ 't', 'o', 'm' ]

解决方案 #

你之前的错误在于把单个name字符串传入Set，导致它会把字符串拆成单个字符去重，完全偏离需求。下面提供两种可行方案：

方案1：先收集所有name再去重输出

先把所有name提取到一个数组，再用Set去重后遍历打印：

// 提取所有name到数组
const allNames = obj.results.flatMap(item => 
  item.data.labels.results.map(res => res.name)
);
// 去重后输出
[...new Set(allNames)].forEach(name => console.log(name));

方案2：遍历过程中实时去重

用Set记录已经打印过的name，遇到未记录的才打印：

const printedNames = new Set();

obj.results.forEach(item => {
  if (item.data.labels.results.length) {
    item.data.labels.results.forEach(res => {
      if (!printedNames.has(res.name)) {
        printedNames.add(res.name);
        console.log(res.name);
      }
    });
  }
});

注意：这里用forEach代替map更合理，因为你只是执行打印操作，不需要生成新数组，map的核心用途是转换数组元素并返回新数组。

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