Question

我有一个对象数组，其值像这样

[
    {
        username: 'Goku',
        hero: 'superman',
        power: 'laser',
        isMasked: false
    },
    {
        username: 'Gohan',
        hero: 'batman',
        power: 'brain',
        isMasked: true
    },
    {
        username: 'Goten',
        hero: 'cyclops',
        power: 'laser',
        isMasked: true
    },
    {
        username: 'picollo',
        hero: 'superman',
        power: 'streangth',
        isMasked: false
    },
    {
        username: 'bulma',
        hero: 'batman',
        power: 'rich',
        isMasked: true
    },
    {
        username: 'brolly',
        hero: 'jin',
        power: 'laser',
        isMasked: false
    }
]

如您所见，该数组包含一个具有不同英雄的json，其中一些英雄具有相同的功能，但是问题是，某些用户具有相同的英雄，我想做的是我要删除我数组中包含与其他英雄相同的英雄的对象，因此输出为

[
    {
        username: 'Goku',
        hero: 'superman',
        power: 'laser',
        isMasked: false
    },
    {
        username: 'Gohan',
        hero: 'batman',
        power: 'brain',
        isMasked: true
    },
    {
        username: 'Goten',
        hero: 'cyclops',
        power: 'laser',
        isMasked: true
    },
    {
        username: 'brolly',
        hero: 'jin',
        power: 'laser',
        isMasked: false
    }
]

如您所见，具有相同英雄的用户将被删除，并且数组仅包含具有独特英雄的对象，我将reactjs用作JavaScript框架，我该怎么做？

Answer 1

这是使用reduce和find的解决方案。

const removeDuplicateByKey = (arr, key) => {
  return arr.reduce((acc, val) => {
    //Found duplicate value
    if (acc.find(el => el[key] === val[key])) {
      return [...acc];
    }
    return [...acc, val];
  }, []);
};

我还创建了一个演示check it out。

Answer 2

您可以在以下步骤中使用Array.prototype.reduce()和Array.prototype.find()来做到这一点：

在reduce()上应用arr，并将ac初始设置为[]。
在reduce()内检查ac是否具有hero等于当前对象的任何obj。
如果是，则返回ac。
如果否，则返回ac和新项目。

var arr = [ { username: 'Goku', hero: 'superman', power: 'laser', isMasked: false }, { username: 'Gohan', hero: 'batman', power: 'brain', isMasked: true }, { username: 'Goten', hero: 'cyclops', power: 'laser', isMasked: true }, { username: 'picollo', hero: 'superman', power: 'streangth', isMasked: false }, { username: 'bulma', hero: 'batman', power: 'rich', isMasked: true }, { username: 'brolly', hero: 'jin', power: 'laser', isMasked: false } ];

let res = arr.reduce((ac,a) => ac.find(x=> x.hero === a.hero) ? [...ac] : [...ac,a],[]);
console.log(res);

Answer 3

您可以使用以下功能为我工作。

function removeDuplicateByKey(arr,key) {
  let uniqueObj = {};
  let filterArr = arr.filter(obj => {
    if (!uniqueObj[obj[key]]) {
      uniqueObj[obj[key]] = 1;
      return obj;
    }
  });
  return filterArr;
}

您可以将其称为removeDuplicateByKey（array，'hero'）

删除数组reactjs中对象特定值的重复项

3 个答案: