过滤包含数组的对象数组

Question

这是我拥有的一个较小版本的数组，但其结构相同

使用下面的const arr，我想要创建2个新的数组，其中包含升序排序的唯一值

const arr = [{
    tags: ['f', 'b', 'd'],
    weight: 7,
    something: 'sdfsdf'
  },
  {
    tags: ['a', 'b', 'c', 'd', 'e'],
    weight: 6,
    something: 'frddd'
  },
  {
    tags: ['f', 'c', 'e', 'a'],
    weight: 7,
    something: 'ththh'
  },
  {
    tags: ['a', 'c', 'g', 'e'],
    weight: 5,
    something: 'ghjghj'
  }
];

const finalTags = [];
const finalWeight = [];

// TODO:  find a better way to do this
arr.forEach(v => {
  if (finalWeight.indexOf(v.weight) === -1) finalWeight.push(v.weight);
  v.tags.forEach(val => {
    if (finalTags.indexOf(val) === -1) finalTags.push(val);
  });
});

// Ascending order
finalTags.sort();
finalWeight.sort();

我上面的代码可以工作，但看起来有些混乱，我想知道是否有更好/更整洁的方法来做到这一点。

- ace2case

---

这个问题是否更适合在https://codereview.stackexchange.com/上进行？ - rh16

Answer 1

你可以使用 Array.prototype.reduce() 以及 Set 来获取一个包含排序数组的对象 {tags: [], weights: []}，以下是最初的回答:

const arr = [{tags: ['f', 'b', 'd'],weight: 7,something: 'sdfsdf'},{tags: ['a', 'b', 'c', 'd', 'e'],weight: 6,something: 'frddd'},{tags: ['f', 'c', 'e', 'a'],weight: 7,something: 'ththh'},{tags: ['a', 'c', 'g', 'e'],weight: 5,something: 'ghjghj'}];
const obj = arr.reduce((a, {tags, weight}) => {
  a.tags = [...new Set(a.tags.concat(tags))];
  a.weights = [...new Set(a.weights.concat(weight))];
  return a;
}, {tags: [], weights: []});

// final result i want
console.log('finalTags:', obj.tags.sort()); // ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
console.log('finalWeight:', obj.weights.sort()); // [5, 6, 7];

.as-console-wrapper { max-height: 100% !important; top: 0; }

- Yosvel Quintero

---

我会给你点赞，因为你和我有类似的想法并且先发表了。不过，看到一些解释也会很好。 - Shidersz

感谢您的评论@Shidersz。我已经添加了更好的描述，您也得到了我的赞。 - Yosvel Quintero

比我的版本好多了，感谢您的所有答案。 - ace2case

Answer 2

一种解决方案是使用 Array.reduce() 创建两个集合，一个包含 tags，另一个包含 weights。之后，您可以将这些 sets 转换为 arrays 并对它们使用 Array.sort()。

const arr = [
  {
    tags: ['f', 'b', 'd'],
    weight: 7,
    something: 'sdfsdf'
  },
  {
    tags: ['a', 'b', 'c', 'd', 'e'],
    weight: 6,
    something: 'frddd'
  },
  {
    tags: ['f', 'c', 'e', 'a'],
    weight: 7,
    something: 'ththh'
  },
  {
    tags: ['a', 'c', 'g', 'e'],
    weight: 5,
    something: 'ghjghj'
  }
];

let res = arr.reduce((acc, {tags, weight}) =>
{
    acc.tags = new Set([...acc.tags, ...tags]);
    acc.weights.add(weight);
    return acc;
}, {tags: new Set(), weights: new Set()});

let sortedWeigths = [...res.weights].sort();
let sortedTags = [...res.tags].sort((a, b) => a.localeCompare(b));
console.log("weights: ", sortedWeigths, "tags: ", sortedTags);

.as-console {background-color:black !important; color:lime;}
.as-console-wrapper {max-height:100% !important; top:0;}

- Shidersz

Answer 3

您可以使用以下代码。这基本上将arr拆分为finalTags和finalWeights。

.flat()将数组展平（[1，[2，[3]]]将变为[1，2，3]）

finalTags.filter((item，index) => finalTags.indexOf(item) >= index).sort();去除重复项。

const arr = [{
    tags: ['f', 'b', 'd'],
    weight: 7,
    something: 'sdfsdf'
  },
  {
    tags: ['a', 'b', 'c', 'd', 'e'],
    weight: 6,
    something: 'frddd'
  },
  {
    tags: ['f', 'c', 'e', 'a'],
    weight: 7,
    something: 'ththh'
  },
  {
    tags: ['a', 'c', 'g', 'e'],
    weight: 5,
    something: 'ghjghj'
  }
];

let finalTags = arr.map(e => e.tags);
finalTags = finalTags.flat();
finalTags = finalTags.filter((item, index) => finalTags.indexOf(item) >= index).sort();

let finalWeight = arr.map(e => e.weight);
finalWeight = finalWeight.filter((item, index) => finalWeight.indexOf(item) >= index).sort();

console.log(finalTags);
console.log(finalWeight);

来源：

去重：https://gomakethings.com/removing-duplicates-from-an-array-with-vanilla-javascript/

- Aniket G