Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> JavaScript

Cách nhóm mảng đối tượng theo khóa trong JavaScript

Giả sử chúng ta có mảng đối tượng chứa dữ liệu về xe hơi như sau:

const arr = [ 
  { 
    'make': 'audi', 
    'model': 'r8', 
    'year': '2012' 
  }, { 
    'make': 'audi', 
    'model': 'rs5', 
    'year': '2013' 
  }, { 
    'make': 'ford', 
    'model': 'mustang', 
    'year': '2012' 
  }, { 
    'make': 'ford', 
    'model': 'fusion', 
    'year': '2015' 
  }, { 
    'make': 'kia', 
    'model': 'optima', 
    'year': '2012' 
  }, 
];

Chúng ta cần viết hàm JavaScript nhận vào mảng này. Hàm nhóm các đối tượng lại dựa trên thuộc tính make của chúng.

Kết quả

Kết quả mong đợi trông như sau:

const output = { 
  'audi': [ 
    { 
      'model': 'r8', 
      'year': '2012' 
    }, { 
      'model': 'rs5', 
      'year': '2013' 
    }, 
  ], 
  'ford': [ 
    { 
      'model': 'mustang', 
      'year': '2012' 
    }, { 
      'model': 'fusion', 
      'year': '2015' 
    } 
  ], 
  'kia': [ 
    { 
      'model': 'optima', 
      'year': '2012' 
    } 
  ] 
};

Ví dụ

Mã thực hiện:

const arr = [ 
  { 
    'make': 'audi', 
    'model': 'r8', 
    'year': '2012' 
  }, { 
    'make': 'audi', 
    'model': 'rs5', 
    'year': '2013' 
  }, { 
    'make': 'ford', 
    'model': 'mustang', 
    'year': '2012' 
  }, { 
    'make': 'ford', 
    'model': 'fusion', 
    'year': '2015' 
  }, { 
    'make': 'kia', 
    'model': 'optima', 
    'year': '2012' 
  }, 
]; 
const groupByMake = (arr = []) => { 
  let result = []; 
  result = arr.reduce((r, a) => { 
    r[a.make] = r[a.make] || []; 
    r[a.make].push(a); 
    return r; 
  }, Object.create(null)); 
  return result; 
}; 
console.log(groupByMake(arr));

Kết quả

Kết quả in ra console:

{ 
  audi: [ 
    { make: 'audi', model: 'r8', year: '2012' }, 
    { make: 'audi', model: 'rs5', year: '2013' } 
  ], 
  ford: [ 
    { make: 'ford', model: 'mustang', year: '2012' }, 
    { make: 'ford', model: 'fusion', year: '2015' } 
  ], 
  kia: [ { make: 'kia', model: 'optima', year: '2012' } ] 
}