Многомерные массивы и их обработка

Встречаем: многомерные массивы! 🌶️

Одномерные массивы — это удобно. Но что, если нужно описать шахматную доску, таблицу или 3D-пространство? На помощь приходят многомерные массивы — структуры данных, где элементы сами являются массивами.

Грубо говоря:

  • Одномерный массив — список (например, [1, 2, 3]).
  • Двумерный массив — таблица (матрица):
[
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
]
  • Трёхмерный и более — «кубы» и сложные структуры (например, вложенные данные террариума 🦎).

Как создать многомерный массив?

Вариант 1: Литеральная нотация (проще всего)

const matrix = [
  ['🔥', '💧', '🌱'],
  ['🌀', '⚡', '❄️'],
  ['☄️', '🌪️', '🌈']
];

Вариант 2: Через циклы (динамически)

Создадим таблицу 3x3, заполненную нулями:

const rows = 3;
const cols = 3;
const grid = [];

for (let i = 0; i < rows; i++) {
  grid[i] = []; // создаём подмассив для каждой строки
  for (let j = 0; j < cols; j++) {
    grid[i][j] = 0;
  }
}

Доступ к элементам: координаты как в игре 🎮

Двумерный массив — это строка и столбец. Индексы начинаются с 0!

const board = [
  ['X', 'O', 'X'],
  ['O', 'X', 'O'],
  ['O', 'O', 'X']
];

console.log(board[0][1]); // 'O' (первая строка, второй столбец)
console.log(board[2][2]); // 'X' (последняя ячейка)

💡 Совет: Первый индекс — это всегда «глубина» вложенности. arr[i][j][k] — трёхмерный массив.


Обходим массивы: вложенные циклы 🔄

Для обработки многомерных массивов обычно используют циклы внутри циклов. Разберём на примере суммы всех элементов:

const nums = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

let sum = 0;

for (let i = 0; i < nums.length; i++) {
  for (let j = 0; j < nums[i].length; j++) {
    sum += nums[i][j];
  }
}

console.log(sum); // 45

Практика: транспонирование матрицы 🔀

Транспонирование — это замена строк на столбцы. Исходная матрица:

1 2 3      1 4 7  
4 5 6     2 5 8  
7 8 9      3 6 9  

Реализация:

function transpose(matrix) {
  const result = [];

  for (let i = 0; i < matrix[0].length; i++) {
    result[i] = [];
    for (let j = 0; j < matrix.length; j++) {
      result[i][j] = matrix[j][i]; // меняем местами i и j
    }
  }

  return result;
}

console.log(transpose([[1, 2, 3], [4, 5, 6], [7, 8, 9]]));

В реальной жизни: работа с таблицами 📊

Двумерные массивы часто используют для:
- Данных из Excel/Google Таблиц.
- Игровых полей (крестики-нолики, сапёр).
- Графических преобразований (фильтры изображений).

Пример: проверка победы в крестики-нолики.

function checkWin(board, player) {
  // Проверяем строки
  for (let row of board) {
    if (row.every(cell => cell === player)) return true;
  }

  // Проверяем столбцы
  for (let col = 0; col < board[0].length; col++) {
    if (board.every(row => row[col] === player)) return true;
  }

  // Диагонали
  if (board[0][0] === player && board[1][1] === player && board[2][2] === player) return true;
  if (board[0][2] === player && board[1][1] === player && board[2][0] === player) return true;

  return false;
}

Современные методы: map, flat, flatMap 🧹

С ES6+ работа с многомерными массивами стала проще:

  • flat(depth) «выравнивает» вложенные массивы:
const arr = [1, [2, [3]]];
console.log(arr.flat(2)); // [1, 2, 3]
  • flatMap объединяет map и flat(1):
const phrases = ["Hello world", "JavaScript is fun"];
const words = phrases.flatMap(phrase => phrase.split(' '));
console.log(words); // ["Hello", "world", "JavaScript", "is", "fun"]

Итог: когда и зачем использовать?

Плюсы:
- Естественное представление табличных данных.
- Простота вложенных операций.

Минусы:
- Большие массивы могут тормозить (оптимизируйте через типизированные массивы, если нужно).
- Сложность отладки при глубокой вложенности.

Пробуйте, экспериментируйте — и скоро вы будете видеть матрицу как Нео! 🕶️

P.S. Если хочется глубже разобрать алгоритмы, загляните к Даниле Бежину на YouTube. Там есть разборы задач именно на многомерные структуры.

Скрыть рекламу навсегда

🎥 YouTube: программирование простым языком

Канал, где я спокойно и по шагам объясняю сложные темы — без заумных терминов и лишней теории.

Подходит, если раньше «не заходило», но хочется наконец понять.

▶️ Смотреть курсы на YouTube