javascript - 有没有更有效的方法来过滤这个对象数组？

Question

我正在处理这个对象数组，并尝试根据匹配的主题 对其进行过滤和重新排序。该数组看起来有点像这样:

const results = [
  {id: 1, subject: 'biology', grade: 10},
  {id: 2, subject: 'biology', grade: 3},
  {id: 3, subject: 'math', grade: 4},
  {id: 4, subject: 'biology', grade: 2},
  {id: 5, subject: 'geography', grade: 1},
  {id: 6, subject: 'physics', grade: 3}
]

将来可能会添加更多主题。超丰富的过滤方式，我可以随心所欲地排列它们:

var filteredObj = {};

filteredObj['biology'] = this.results.filter(function (result) {
    return result.subject === 'biology';
});
filteredObj['math'] = this.results.filter(function (result) {
    return result.subject === 'math';
});
filteredObj['physics'] = this.results.filter(function (result) {
    return result.subject === 'physics';
});
filteredObj['geography'] = this.results.filter(function (result) {
    return result.subject === 'geography';
});

有没有更有效的方法来做到这一点？

Answer 1

您可以使用 Array.reduce()按主题对项目进行分组:

const results = [{"id":1,"subject":"biology","grade":10},{"id":2,"subject":"biology","grade":3},{"id":3,"subject":"math","grade":4},{"id":4,"subject":"biology","grade":2},{"id":5,"subject":"geography","grade":1},{"id":6,"subject":"physics","grade":3}];

const grouped = results.reduce((r, o) => {
  r[o.subject] = r[o.subject] || [];
  
  r[o.subject].push(o);

  return r;
}, Object.create(null));

console.log(grouped);

而且很容易创建一个更通用的 groupBy 函数:

const groupBy = (prop, arr) => arr.reduce((r, o) => {
  r[o[prop]] = r[o[prop]] || [];
  
  r[o[prop]].push(o);

  return r;
}, Object.create(null));

const results = [{"id":1,"subject":"biology","grade":10},{"id":2,"subject":"biology","grade":3},{"id":3,"subject":"math","grade":4},{"id":4,"subject":"biology","grade":2},{"id":5,"subject":"geography","grade":1},{"id":6,"subject":"physics","grade":3}];

const grouped = groupBy('subject', results);

console.log(grouped);