如何使用jQuery去除JSON对象数组中的重复标签

嘿，我明白你遇到的麻烦了——遍历JSON里的标签结果一堆重复的，想得到干净的无重复列表对吧？这其实很容易搞定，我给你两种实用的方案：

方案1：用ES6的Set（最简洁高效） #

Set是ES6自带的集合类型，它的特性就是自动忽略重复值，用它来处理去重简直事半功倍。假设你的JSON结构大概是这样的：

{
  "items": [
    { "tags": ["前端", "JavaScript", "React"] },
    { "tags": ["JavaScript", "Vue"] },
    { "tags": ["前端", "CSS"] }
  ]
}

对应的代码实现：

// 你的原始JSON对象
const yourData = {
  items: [
    { tags: ["前端", "JavaScript", "React"] },
    { tags: ["JavaScript", "Vue"] },
    { tags: ["前端", "CSS"] }
  ]
};

// 第一步：把所有标签从嵌套数组里提取出来，变成一维数组
const allTags = yourData.items.flatMap(item => item.tags);
// 第二步：用Set去重，再转回普通数组
const uniqueTags = [...new Set(allTags)];

// 现在uniqueTags就是无重复的标签数组了，直接用来渲染列表就行！
console.log(uniqueTags); // 输出: ["前端", "JavaScript", "React", "Vue", "CSS"]

方案2：手动检查（兼容旧环境，更直观） #

如果你的运行环境不支持ES6的Set（现在很少见了，但还是给你备着），可以手动检查每个标签是否已经存在于结果数组中，不存在再push：

const yourData = { /* 同上 */ };
const uniqueTags = [];

// 遍历每个对象
yourData.items.forEach(item => {
  // 遍历当前对象的所有标签
  item.tags.forEach(tag => {
    // 检查标签是否已经在uniqueTags里，不在就添加
    if (!uniqueTags.includes(tag)) {
      uniqueTags.push(tag);
    }
  });
});

console.log(uniqueTags); // 同样得到去重后的标签数组

你之前没成功的原因应该是没做这个includes的存在性检查，直接把所有标签都push进去了，所以才会有重复。现在用上面两种方法中的任意一种，都能得到干净的无重复标签数组啦～

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