Многомерные массивы JavaScript

Правда выходит наружу

По правде говоря, JavaScript не поддерживает напрямую двух- или многомерные массивы.

Некоторые языки, например C #, Java и даже Visual Basic, позволяют объявлять многомерные массивы. Но не JavaScript. В JavaScript их нужно создавать.

Личное примечание: мне нравится создавать их. Это помогает мне понять, как они на самом деле работают.

Мы сосредоточимся на двумерных массивах.

Определение

Двумерный массив - это набор элементов, которые организованы как матрица из строк и столбцов и имеют имя.

Абстрактное решение

Двумерный массив в JavaScript - это массив массивов, поэтому мы создаем массив одномерных объектов массива.

Давайте рассмотрим это через проблему и решение.

Эта проблема

Допустим, мне нужен двумерный массив букв алфавита, который называется письмами, например

Если мы присмотримся, то увидим, что первая строка букв представляет собой одномерный массив, firstRow = [a, f, k]. Вторая строка также представляет собой одномерный массив, secRow = [b, g, l] и так далее.

Точно так же первый столбец букв представляет собой одномерный массив,
firstCol = [a, b, c] с secondCol = [f, g, h ] и так далее.

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

По сути, это массив массивов. Просто, Ха!

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

В приведенном выше примере мы могли получить доступ к букве «а», указав
firstRow [0] или firstCol [0].

Это приводит нас к решению для доступа к элементам двумерного массива. Для нашего массива букв к букве «а» можно будет получить доступ, указав
буквы [0] [0]. Буква «h», указав буквы [2] [1].

По сути, arrayName [rowIndex] [columnIndex].

Итак, как нам построить этот массив и как с ним работать?

Решение

Чтобы создать двумерный массив, сначала создайте одномерный массив. Затем переберите каждый элемент в исходном одномерном массиве и создайте еще один одномерный массив в каждой позиции индекса исходного одномерного массива.

Давайте возьмем наш массив букв в качестве примера.

Сначала мы создадим одномерный массив, способный хранить 3 «вещи». Затем мы пройдемся по массиву и сделаем каждую из этих «вещей» массивом, способным хранить 3 вещи, букву.

// Create a one dimensional array 
// capable of storing 3 objects
let  letters = new Array(3); // Indices 0,1,2
  
  
// Loop through the array, adding a 
// new array to each location
for (let i = 0; i < letters.length; i++) { 
    letters[i] = new Array(3);// new array of 3 locations
} 
// Put items in the 2D array
letters[0][0]='a';
letters[0][1]='f';
letters[0][2]='k';
letters[1][0]='b';
letters[1][1]='g';
letters[1][2]='l';
letters[2][0]='c';
letters[2][1]='h';
letters[2][2]='m';
// Display the 2D Array
console.table(letters);

Запуск это дает,

Console.table () отлично справляется. Но к элементам можно получить доступ, используя вложенные циклы for или один из многих других способов, например forEach.

// Noticed they are row accessed first
letters.forEach(row=>{
    row.forEach(cell=>{
        console.log(cell);
        console.log(typeof cell);
   })
})

Какие выходы,

Или что-то вроде,

// Better to use console.dir() and not console.log()
for ( i in letters){
    for ( j in letters[i]){
      console.dir(letters[i][j]);
    }
}

Обратите внимание на использование console.dir (). Это связано с тем, что console.log () возвращает объект в его строковом представлении, а console.dir () распознает объект как объект и выводит его свойства.

Важно помнить, имя_массива [rowIndex] [columnIndex]

Для «куба», трехмерного массива нам понадобится массив массивов массивов. Доступ к элементам таким способом, как, имя_массива [i] [j] [k].

Заключение

Поскольку JavaScript не поддерживает напрямую двух- или многомерные массивы, мы можем при необходимости эмулировать их, используя Массивы массивов… в зависимости от наших потребностей.

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

Спасибо за чтение, и я призываю вас изучить это дальше.

Удачного кодирования!

Прочтите все статьи на Medium, которые вам нужны, и помогите мне продолжать писать, став участником Medium всего за 5 долларов в месяц.

Вам также может понравиться,