javascript - 在 Javascript 对象数组中映射和缩减数组

Question

如有任何建议，我将不胜感激。我需要从下面对象数组中的数组中提取关键字，并减少它们以显示所有关键字而不重复。

我的数据 JSON 对象如下:

[
  {
    "word":"Cat",
    "answer":"A type of feline",
    "keywords": ["pet", "mouse-catcher"]
  },
  {
    "word":"Dog",
    "answer":"A type of canine",
    "keywords": ["pet", "cat-catcher"]
  },
]

我的JS代码如下:

let keywordList = data.map(entry => {

  let list = [...entry.keywords];
    return (
      list.reduce(( finalArray, current ) => finalArray.concat(current),[])
  );
});

在我的 React 组件中，我再次使用 map 遍历数组:

<p>
  keywords: {keywordList.map((word, index) => {
    return (
      <span key={word+index}>
        <a onClick={this.searchKeyword} href="#" id={word}>{word}</a>
        <span> | </span>
      </span>
    );

  })}
</p>

不幸的是，我的 reduce 函数似乎没有工作，我得到了一个数组数组。任何建议都会很棒。

Answer 1

let data = [{
    "word": "Cat",
    "answer": "A type of feline",
    "keywords": ["pet", "mouse-catcher"]
  }, {
    "word": "Dog",
    "answer": "A type of canine",
    "keywords": ["pet", "cat-catcher"]
  }
]

let keywords = [...new Set(data.reduce((a, e) => a.concat(e.keywords), []))]

JSFiddle