Итерация по массиву с одним индексом, который содержит несколько объектов

Question

У меня есть некоторые данные, которые выглядят так:

let arr = [
  {
    a:1,
    b:2,
    c:3
  },
  {
    a:4,
    b:5,
    c:6
  },
  {
    a:7,
    b:8,
    c:9
  }
]

, и я бы хотел, чтобы они переформатировались следующим образом

{
   a: [1,4,7],
   b: [2,5,8],
   c: [3,6,9]
}

Вот мое решение:

let arr = [
  {
    a:1,
    b:2,
    c:3
  },
  {
    a:4,
    b:5,
    c:6
  },
  {
    a:7,
    b:8,
    c:9
  }
]

// {
//   a: [1,4,7],
//   b: [2,5,8],
//   c: [3,6,9]
// }

function practice (arr) {
  console.log(typeof arr) // WHY IS THIS RETURNING AN OBJECT???
  let keys = Object.keys(arr[0])
  const resultObj = {}
  for (let key of keys) {
    resultObj[key] = []
  }
  arr.forEach((x,idx)=> {
    for (let key in x) {
      resultObj[key].push(x[key])
    }
  })
    return resultObj
}

practice(arr)

Я знаю, что моё решение не самый эффективный метод. Когда я выполнил упражнение, у меня возникли проблемы с пониманием следующих понятий:

• На первый взгляд arr мне кажется массивом с одним индексом, содержащим три объекта, Например, arr[0] = {obj1},{obj2},{obj3}, но я выполнил проверку typeof на arr, и он вернул объект.
• Когда я консольный журнал arr с указанным индексом arr[1], он печатает {a:4,b:5,c:6} как будто это массив.
• Мой вопрос: что здесь происходит и что именно представляет собой этот тип структуры данных?

Пожалуйста, предложите мне более чистый и эффективный код для этот вопрос и объясните мне понятия.

Answer 1

Чтобы проверить массив, вы должны использовать метод Array.isArray(). typeof даст вам объект, так как Array по сути является формой объекта в javascript, созданного с использованием конструктора Object.

Чтобы получить желаемый результат, все, что вам нужно сделать, это l oop по массиву и сохранить значения в объекте

let arr = [
  {
    a:1,
    b:2,
    c:3
  },
  {
    a:4,
    b:5,
    c:6
  },
  {
    a:7,
    b:8,
    c:9
  }
]

var res = {};
arr.forEach((obj) => {
   Object.entries(obj).forEach(([key, val]) => {
      if(res[key]) {
         res[key].push(val);
      } else {
         res[key] = [val];
      }
   })
});

console.log(res);

Answer 2

Вы можете использовать метод массива reduce() для этого, например:

• L oop через все ключи каждого объекта в массиве, используя Object.keys(o) внутри reduce() method
• Внутри l oop, инициализируйте аккумулятор тем же ключом, который есть у нас внутри l oop, и начальное значение этого ключа как пустой массив [].
• Затем, используя r[k].push(o[k]), мы добавляем соответствующие значения ключа в этот массив.
• Затем, наконец, возвращаем объект r из метода .reduce().

let arr = [{a:1,b:2,c:3},{a:4,b:5,c:6},{a:7,b:8,c:9}];
const res = arr.reduce((r, o) => {
  Object.keys(o).forEach((k) => {
    r[k] = r[k] || [];
    r[k].push(o[k])
  });
  return r;
}, {})

console.log(res)

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

Answer 3

Попробуйте

function practice (arr) {
  let resultObj = {};

  arr.forEach((x) => {
    for (let key in x) {
      if (resultObj.hasOwnProperty(key)) {
        resultObj[key].push(x[key]);
      } else {
        resultObj[key] = [x[key]];
      }
    }
  });

  return resultObj;
}

Answer 4

С помощью нескольких циклов forEach строят Объект с ключами и значениями объединяются для одного и того же ключа.

let arr = [
  {
    a: 1,
    b: 2,
    c: 3
  },
  {
    a: 4,
    b: 5,
    c: 6
  },
  {
    a: 7,
    b: 8,
    c: 9
  }
];

const res = {};
arr.forEach(item => {
  Object.keys(item).forEach(
    key => (res[key] = key in res ? [...res[key], item[key]] : [item[key]])
  );
});

console.log(res);

Answer 5

Вы можете попробовать это-

let arr = [
  {
    a:1,
    b:2,
    c:3
  },
  {
    a:4,
    b:5,
    c:6
  },
  {
    a:7,
    b:8,
    c:9
  }
];

let res = {};

Object.values(arr).forEach(value => {
  Object.keys(value).forEach(key => {
   if (typeof res[key] === 'undefined') {
     res[key] = [];
   }
   res[key].push(value[key])
  })
})


console.log(res);