Javascript - 从对象内部的数组中获取唯一值

Posted 2023-02-14

【中文标题】Javascript - 从对象内部的数组中获取唯一值

【英文标题】：Javascript - get unique values from an array inside object

【发布时间】：2020-07-14 05:42:35

【问题描述】：

我正在尝试从数组内部的数组和对象中检索所有唯一值

var items = [

  colors:['white', 'black'],
  fruits:['apple, banana']
,


  colors:['yellow', 'black'],
  fruits:['mango, blueberry'],
,
...
]

const property = 'colors'
const values = this.distinct(this.items.map(item => item[property].map(elem => elem))

我希望这些值返回一个包含每个颜色值的数组，如下所示：

['black','white','yellow']

但它不起作用，我不明白为什么

【参考方案1】：

reduce 可用于遍历数组并指定颜色作为累加器对象的键：

const result = items.reduce((a, colors)=> 
    colors.forEach(cl => a[cl] = 1);
    return a;
, )
console.log(Object.keys(result));

或单线方式：

Object.keys(items.reduce((a, colors)=> (colors.forEach(cl => a[cl] = 1) , a), ));

Read more about reduce method

一个例子：

let items = [
    
        colors: ['white', 'black'],
        fruits: ['apple, banana']
    ,

    
        colors: ['yellow', 'black'],
        fruits: ['mango, blueberry'],
    
]

const result = items.reduce((a, colors)=> 
    colors.forEach(cl => a[cl] = 1);
    return a;
,)
console.log(Object.keys(result));

const oneLine = Object.keys(items.reduce((a, colors)=> 
    (colors.forEach(cl => a[cl] = 1) , a), ));
console.log(oneLine);

【参考方案2】：

flatMap对象数组提取每个colors子数组，传入Set构造函数去重复，将Set转回数组：

var items = [
  colors:['white', 'black'],
  fruits:['apple, banana']
,
  colors:['yellow', 'black'],
  fruits:['mango, blueberry'],
];
const colorsSet = new Set(
  items.flatMap(item => item.colors)
);
const uniques = [...colorsSet];
console.log(uniques);