Эффективный способ преобразования массива объектов

Question

У меня есть следующая структура данных, которую я получаю из некоторых API:

response = [{grade: 'A', frequency: 54, percentage: 24},
      {grade: 'B', frequency: 50, percentage: 10},
      {grade: 'C', frequency: 0, percentage: 0},
      {grade: 'D', frequency: 50, percentage: 20},
      ...
    ];

Теперь некоторые библиотеки JavaScript пользовательского интерфейса требуют, чтобы эти данные были отформатированы и представлены следующим образом:

label: ['A', 'B', 'C', 'D'];
data: [[54,50,0,50],[24,10,0,20]];
series: ['frequency', 'percentage'];

Каков наиболее эффективный способ преобразования объекта response в вышеуказанные элементы?

let label = response.map(data => data.grade);
let freqencyData = response.map(data => data.freqency);
let percentageData = response.map(data => data.percentage);
let data = [freqencyData, percentageData];

Будет ли что-то подобное достаточно эффективным? Пожалуйста, обратите внимание, что это не пример, а данные ответов в моем случае слишком велики, и трижды составленная карта кажется излишним. Спасибо

Answer 1

Вы можете просто сделать старомодный цикл:

let label = [];
let freqencyData = [];
let percentageData = [];

response.forEach(function(element) {
  label.push(data.grade);
  frequencyData.push(data.frequency);
  percentageData.push(data.percentage);
});

let data = [freqencyData, percentageData];

Answer 2

Вы можете использовать функцию reduce, чтобы построить практически желаемый выход за один цикл.

1. Разделите атрибут label с остальными атрибутами.
2. Сгруппируйте значения по определенному имени свойства (данные, метка и серия).
3. Объект Set позволяет хранить уникальные строки для series.
4. Object.from преобразует объект Set в массив.
5. Object.values выдержки из этого: {frequency: [1,2,3], percentage: [1,2,3]} к этому: [[1,2,3], [1,2,3]]

let response = [{grade: 'A', frequency: 54, percentage: 24},{grade: 'B', frequency: 50, percentage: 10},{grade: 'C', frequency: 0, percentage: 0},{grade: 'D', frequency: 50, percentage: 20}];
let result = response.reduce((a, {grade: label, ...rest}) => {
  Object.keys(rest).forEach(k => {
    (a.series || (a.series = new Set())).add(k);
    a.data = a.data || {};
    (a.data[k] || (a.data[k] = [])).push(rest[k]);
  });  
  (a.label || (a.label = [])).push(label);
  
  return a;
}, Object.create(null));

result.series = Array.from(result.series);
result.data = Object.values(result.data);

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }