如果元素中已存在元素,请不要再次添加

Question

我有一个对象数组,如下所示:

var array = [
    {id:123, value:"value1", name:"Name1"},
    {id:124, value:"value2", name:"Name1"},
    {id:125, value:"value3", name:"Name2"},
    {id:126, value:"value4", name:"Name2"}
    ...
];

如您所见,有些名称会重复出现.我想获得一个只有名字的新数组,但是如果某些名称重复,我不想再添加它.我想要这个数组:

var newArray = ["Name1", "Name2"];

我正在尝试这样做map:

var newArray = array.map((a) => {
    return a.name;
});

但问题是这会返回:

newArray = ["Name1", "Name1", "Name2", "Name2"];

我怎样才能在里面设置一些条件map,所以它不会返回已经存在的元素？我想用map或其他一些ECMAScript 5或ECMAScript 6功能.

Answer 1

使用ES6,Set只能映射对象的名称后,可以使用唯一值.

此提议使用扩展语法...来收集新数组中的项目.

const array = [{ id: 123, value: "value1", name:"Name1" }, { id: 124, value: "value2", name: "Name1" }, { id: 125, value: "value3", name: "Name2" }, { id: 126, value: "value4", name: "Name2" }],
      names = [...new Set(array.map(a => a.name))];

console.log(names);

Answer 2

如果您正在寻找不是ES 6(无Set)的JavaScript解决方案,您可以使用Array的reduce方法:

var array=[
  {id:123, value:"value1", name:"Name1"},
  {id:124, value:"value2", name:"Name1"},
  {id:125, value:"value3", name:"Name2"},
  {id:126, value:"value4", name:"Name2"}
];
var names = array.reduce(function (a, b) {
  if (a.indexOf(b.name) == -1) {
    a.push(b.name)
  }
  return a;
}, []);

console.log(names);

Answer 3

就个人而言,我不明白为什么每个人都对ES 6感到满意.如果是我的代码,我宁愿支持尽可能多的浏览器.

var array=[
{id:123, value:"value1", name:"Name1"},
{id:124, value:"value2", name:"Name1"},
{id:125, value:"value3", name:"Name2"},
{id:126, value:"value4", name:"Name2"}
];

   // Create array of unique names
var a = (function(a){
  for (var i = array.length; i--;)
    if (a.indexOf(array[i].name) < 0) a.push(array[i].name);
  return a;
})([]);

console.log(a);

Answer 4

你也可以简单地结合起来map用filter

var array = [
  {id:123, value:"value1", name:"Name1"},
  {id:124, value:"value2", name:"Name1"},
  {id:125, value:"value3", name:"Name2"},
  {id:126, value:"value4", name:"Name2"}
];

var unique = array
  .map( item => item.name )
  .filter( ( item, idx, arr ) => arr.indexOf( item ) == idx ) 

console.log(unique)

Answer 5

您可以使用参数获取Array.prototype.map()以获取具有objects name属性和Array.prototype.filter()的数组elem,index并array在函数谓词中消除重复的元素:

var array = [{id:123, value:"value1", name:"Name1"}, {id:124, value:"value2", name:"Name1"}, {id:125, value:"value3", name:"Name2"}, {id:126, value:"value4", name:"Name2"}],
    names = array
      .map(e => e.name)
      .filter((e, i, a) => a.indexOf(e) === i);

console.log(names);

Answer 6

这里有很多好的答案.我只想提供一些多样性,希望能给你另一个视角.

数组在JavaScript中是对象类型,因此它们可以同时用作哈希.通过使用此功能,我们可以极大地简化在O(n)时间复杂度的单个reduce操作中完成的工作.

如果您对包含数组键以外的某些属性的数组不满意,则可以考虑保留单独的哈希对象.

var array = [{id:123, value:"value1", name:"Name1"},
             {id:124, value:"value2", name:"Name1"},
             {id:125, value:"value3", name:"Name2"},
             {id:126, value:"value4", name:"Name2"}
            ],
result = array.reduce((p,c) => p[c.name] ? p : (p[c.name] = true, p.push(c.name), p), []);
console.log(result);

Answer 7

我同意,如果你只需要name价值观,那Set就是一种方法.

但是,如果您想根据name属性获取一组唯一对象,我建议使用Map.创建Map的一种快速方法是通过一组[key, value]数组:

const array = [{ id: 123, value: "value1", name:"Name1" }, { id: 124, value: "value2", name: "Name1" }, { id: 125, value: "value3", name: "Name2" }, { id: 126, value: "value4", name: "Name2" }],
      unique = new Map(array.map(obj => [obj.name, obj]));

// To get the unique objects
const uniques = Array.from(unique.values());

// Get the names like you already did:
console.log("Names:", uniques.map(obj => obj.name));

// If you ever need the complete array of unique objects, you got a ref:
console.log(JSON.stringify(uniques));

.as-console-wrapper { min-height: 100%; }

另一个好处Map是,您既可以获得filter切断非独特的功能,又不会丢失与源对象的连接.当然,只有在需要多次引用唯一的对象集时才需要它.