Зацикливание на массиве массивов объектов

#javascript

Вопрос:

У меня есть массив массивов объектов, которые я хочу зациклить и распечатать каждый элемент, но по какой-то причине цикл пропускает некоторые элементы, и я понимаю, почему, но я не знаю, как это лучше всего исправить

Вот код, который я использовал :

 const test = [
  [
    {
      SESSION_ID: "200",
    },
    {
      SESSION_ID: "296",
    },
  ],
  [
    {
      MICROFILM_REF_NUMBER: "9,52E 22",
    },
    {
      MICROFILM_REF_NUMBER: "9,52E 22",
    },
  ],
];

test.forEach((element, index) => {
  console.log(element[index].SESSION_ID);
  console.log(element[index].MICROFILM_REF_NUMBER);
});
 

Результат, который я получаю, таков :

 200
undefined
undefined
9,52E 22
 

Желаемый результат — :

 200
296
9,52E 22
9,52E 22 
 

Комментарии:

1. Данные index , полученные с помощью forEach, связаны с текущими массивами верхнего уровня element , но вы используете их для доступа к своему внутреннему массиву.

2. Это поможет вам устранить проблему, если вы назначите уникальные значения каждому полю. Рассмотрим, что element и index как происходит на каждой итерации.

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

4. Дело в том, что это очень упрощенная версия проблемы, с которой я столкнулся, данные, которые вы можете видеть test , — это данные JSON из API, и мне нужно распечатать все в одной таблице, поэтому мне необходимо выполнить итерацию по всему, используя один цикл вместо 2

5. В этом случае вы слишком упростили свою цель и в результате получите неадекватные ответы. Вы должны где-то перебирать внутренние массивы, но если вам нужны столбцы таблицы, которые отличаются от ведения журнала в консоли, и вам, вероятно, понадобятся эти данные в другом массиве

Ответ №1:

Вероятно, вам следует использовать другую структуру данных, но для вашего вопроса это один из ответов

 test.forEach((array, index) => {
  array.forEach((element, idx)=>{
    if(element.SESSION_ID) console.log(element.SESSION_ID)
    if(element.MICROFILM_REF_NUMBER) console.log(element.MICROFILM_REF_NUMBER)
  })
});
 

Ответ №2:

Поскольку вы упомянули таблицу, я полагаю, что вам нужно что-то более похожее на следующее, что сопоставляет ваши данные с rows массивом, который затем можно легко повторить, чтобы вставить строки и ячейки в элемент таблицы

 const col_props = ['SESSION_ID', 'MICROFILM_REF_NUMBER'];

const rows = data[0].map((_, i) => {
  return data.map((arr, j) => arr[i][col_props[j]]);
});

console.log('Rows:',JSON.stringify(rows))

// for headings in demo
rows.unshift(col_props)

const table = document.querySelector('#myTable');

rows.forEach(arr => {
  const row = table.insertRow()
  arr.forEach(v => row.insertCell().textContent = v)
}) 
 <table id="myTable" border="1"></table>

<script>
const data=[[{SESSION_ID:"200"},{SESSION_ID:"296"}],[{MICROFILM_REF_NUMBER:"9,52E 22"},{MICROFILM_REF_NUMBER:"9,52E 22"}]];
</script>