как я могу сгруппировать массив значений внутри объекта в другой массив объектов

#javascript #arrays #json #reactjs #ecmascript-6

#javascript #массивы #json #reactjs #ecmascript-6

Вопрос:

У меня есть объект с массивом значений


{firstName: ['John', 'Mike']}, lastName: ['Doe', 'Smith']} ,


Теперь у меня есть пустой объект с массивом


const newData = {}
newData.ppl = []


как я могу получить этот результат в ppl массиве, подобном: ppl = [{firstName: 'John', lastName: 'Doe'}, {firstName: 'Mike', lastName: 'Smith'}]

Ответ №1:

Быстрая реализация с Object.entries , reduce и forEach :

 const srcData = {
  firstName: ['John', 'Mike'],
  lastName: ['Doe', 'Smith']
};

const ppl = Object
  .entries(srcData)
  .reduce((acc, [key, values]) => {
    values.forEach((val, i) => {
      if (i >= acc.length) {
        acc.push({});
      }
      acc[i][key] = val;
    });
    return acc;
  }, []);

console.log(ppl);  

Объяснение:

  1. Используйте Object.entries , чтобы get превратить объект в массив пар ключ-значение.
  2. Используйте .reduce для итеративного создания результирующего массива.
  3. Используйте .forEach для перебора массива значений, полученных из (1), помещая пустой объект в массив ( push({}) ), если результирующий массив недостаточно длинный, чтобы вместить все элементы в текущем массиве значений

Ответ №2:

Выполните итерацию firstName с Array.forEach() и возьмите первое имя. Используйте индекс, чтобы взять соответствующую фамилию из lastName массива. Вставьте новый объект с именем и фамилией в ppl массив.

 const data = {firstName: ['John', 'Mike'], lastName: ['Doe', 'Smith']};

const newData = { ppl: [] };

data.firstName.forEach((firstName, i) => 
  newData.ppl.push({ 
    firstName, 
    lastName: data.lastName[i] 
  })
);

console.log(newData);  

Ответ №3:

Вы могли бы получить записи и присвоить свойства тому же индексу, что и значения массива.

Это работает для любого произвольного количества свойств.

 var data = { firstName: ['John', 'Mike'], lastName: ['Doe', 'Smith'] },
    result = Object
        .entries(data)
        .reduce((r, [k, a]) => (a.forEach((v, i) => (r[i] = r[i] || {})[k] = v), r), []);

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

Ответ №4:

используя карту.

 let master = {firstName: ['John', 'Mike'], lastName: ['Doe', 'Smith']}

const newData = {};
newData.ppl = master.firstName.map((f,i) => {
  return {firstName: f, lastName: master.lastName[i]};
});

console.log(newData.ppl);  

Ответ №5:

Вы можете сделать это с помощью Array.reduce() , Object.values() и Object.entries() вот так:

 const data = { firstName: ['John', 'Mike'], lastName: ['Doe', 'Smith'] };

const ppl = Object.entries(data).reduce((acc, [key, arr]) => {
  arr.forEach((v, i) => (acc[i] = (acc[i] || {}))[key] = v);
  return acc;
}, {});

const newData = { ppl: Object.values(ppl) };

console.log(newData);