Двумерный массив в JavaScript

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

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

Многомерный массив это массив, у которого один или больше элементов, являются также массивами. В зависимости от глубины объявления, в частности он может называться двумерным массивом(2 уровня) либо трёхмерным массивом(3 уровня) либо четырехмерным(4 уровня) и так далее.

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

Структура двумерного массива

Двумерный массив

Как видите, элементы двумерного массива являются одномерные массивы. Если бы эти одномерные массивы содержали ещё массивы, то массив arr был бы уже трёхмерным.

Для примера давайте создадим три простых массивов и заполним их данными. Первого мы заполним чётными числами, второго заполним нечётными числами, а третьего какими-то произвольными данными.

//Объявляем три пустых массивов
var evenNumbers = new Array();

//Переменная k - для индексов массива evenNumbers
var k = 0;
var oddNumbers = new Array();

//Переменная n - для индексов массива oddNumbers
var n = 0;

var data = new Array('car', 'plane', true, 89, 'm');

//Заполняем массив evenNumbers, с четными числами
for(var i = 1; i < 10; i++){
    if( i % 2 == 0){
        evenNumbers[k] = i;
        //Инкрементируем индекс
        k++;
    }
}

//Заполняем массив oddNumbers, с нечетными числами
for(var i = 1; i < 10; i++){
    if( i % 2 != 0){
        oddNumbers[n] = i;
        //Инкрементируем индекс
        n++;
    }
}

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

Например, мы хотим увидеть содержимое массива с нечётными числами oddNumbers. Для этого в коде ниже пишем такую строку:

console.log(oddNumbers);

Чтобы увидеть результат, необходимо открыть консоль в браузере. В Google Chrome это делается так: нажимаем правый клик мыши на странице, и из контекстного меню выбираем последнею опцию “Просмотреть код”, то есть инспектор. В английской версии, эта опция называется Inspect.

Открываем консоль разработчика в chrome

И ниже появится панель инструментов разработчика. В ней необходимо перейти во вкладку Console(Консоль).

вывод содержимого одномерного массива javascript

Теперь для того чтобы создать двумерный массив, необходимо объявить его, и добавить в нём одномерные массивы, которые создали выше.

//Объявляем двумерный массив twoDimens, и заполняем его
var twoDimens = new Array(evenNumbers, oddNumbers, data);
console.log(twoDimens);

Посмотрим в консоль содержимое данного массива.

вывод содержимого двумерного массива javascript

перебор двумерного массива

Для начала научимся, как обратится к элементам двумерного массива.

Как и с одинарными массивами, обращение к элементам делается по их индексам.

Для примера давайте выведем на экран, элемент с индексом 3 из массива с нечётными числами(oddNumbers). Индекс одномерного массива oddNumbers в двумерном массиве twoDimens равен единице(1).

document.write("Элемент с индексом 3 из массива нечётных чисел oddNumbers равен: " + twoDimens[1][3] ); // Элемент: 7

В массиве twoDimens мы обращаемся к элементу с индексом 1. Элемент, который находится под этим индексом, является массив oddNumbers. И в этом массиве мы уже обращаемся к элементу с индексом 3, который является числом 7.

Теперь приступим к самому вопросу как перебрать двумерный массив.

Перебор двумерного массива делается с помощью двойного цикла. Для примера, сделаем перебор нашего массива twoDimens.

for(var i = 0; i < twoDimens.length; i++){
    for(var j = 0; j < twoDimens[i].length; j++){
        document.write("<p>Элемент с индексом <strong>" + i + ' ' + j + "</strong> равен: <strong>" + twoDimens[i][j] + "</strong> </p>");
    }
}

В первом цикле мы делаем перебор самого массива twoDimens. Во втором цикле мы делаем уже перебор самого элемента (массива). Сначала, переменная i равна 0. Поэтому во втором цикле мы сначала делаем перебор первого массива evenNumbers, который имеет индекс 0. И уже внутри второго цикла мы обращаемся к элементам данного массива. Таким образом: twoDimens[0][j]. Где j меняется от 0 до длины массива evenNumbers.

После перебора элементов из первого массива, возвращаемся к первому циклу, инкрементируем переменную i, и переходим к перебору уже второго массива oddNumbers, который имеет индекс 1. И так вот делается перебор каждого элемента двумерного массива twoDimens.

Теперь посмотрим на результат данного перебора:

Перебор двумерного массива

Вот и все, о чем хотел я рассказать в этой статье. Теперь Вы знаете, как создать двумерный массив, как обратится к элементам двумерного массива и как перебрать двумерный массив. Надеюсь, что всё было понятно. Желаю Вам больших успехов!

Похожие статьи:

Понравилась статья?

Тогда поделитесь ею с друзьями и подпишитесь на новые интересные статьи.

Поделиться с друзьями:

Подписаться на новые статьи:

Delivered by FeedBurner

Поддержите пожалуйста мой проект!

<< Предыдущая статьяСледующая статья >>

Если у Вас есть какие-то вопросы или предложения, то можете писать их в комментариях или мне на почту sergiu1607@gmail.com. И если Вы заметили какую-то ошибку в статье, то прошу Вас, сообщите мне об этом, и в ближайшее время я всё исправлю.

Добавляйтесь ко мне в друзья в:

Добавляйтесь в мои группы:

Подпишитесь на мои каналы:

Автор статьи: Мунтян Сергей

Копирование материалов с сайта sozdatisite.ru ЗАПРЕЩЕНО!!!

Дата добавления: 2016-10-11 00:54:59