Шаг 25.
Основы JavaScript.
Многомерные массивы

    На этом шаге мы рассмотрим создание и использование многомерных массивов.

    Массивы, рассмотренные на предыдущем шаге, являются одномерными. Их можно представить себе в виде таблицы из одного столбца. Однако элементы массива могут содержать данные различных типов, в том числе и объекты, а значит, и массивы. Если в качестве элементов некоторого одномерного массива создать массивы, то получится двухмерный массив. Обращение к элементам такого массива происходит в соответствии со следующим синтаксисом:

    имя_массива[индекс_уровня1] [индекс_уровня2]

    Если массив имеет размерность, большую двух, то синтаксис обращения к массивам аналогичен предыдущему: следует добавить нужное количество квадратных скобок, заключающих нужные индексы.

    Типичным примером двухмерного массива является массив опций меню. У такого меню есть горизонтальная панель с опциями, называемая главным меню. Некоторым опциям главного меню соответствуют раскрывающиеся вертикальные подменю со своими опциями. Мы создаем массив, длина которого равна количеству опций главного меню. Элементы этого массива определяем как массивы названий опций соответствующих подменю. Чтобы была ясна структура нашей конструкции, мы выбрали названия опций надлежащим образом. Например, "Меню 2.1" - название 1-й опции подменю, соответствующего 2-й опции главного меню.

    Приведем текст скрипта, решающего данную задачу.

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
var menu = new Array();
menu[0] = new Array("Меню 1.1", "Меню 1.2", "Меню 1.3");
menu[1] = new  Array("Меню 2.1", "Меню 2.2");
menu[2] = new  Array("Меню 3.1", "Меню 3.2", "Меню 3.3", "Меню 3.4");
alert (menu[2][1]);  // Значение равно  "Меню 3.2"
//-->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
Текст этого документа можно взять здесь.

    При выполнении этого скрипта на экране появится диалоговое окно с сообщением "Меню 3.2".

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

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
var menu = new Array();
// Массив опций главного меню: 
menu[0] = new Array("Меню 1", "Меню 2", "Меню З");
menu[1] = new Array();
menu[1][0] = new Array("Меню 1.1", "Меню 1.2", "Меню 1.3");
menu[1][1] = new Array("Меню 2.1", "Меню 2.2");
menu[1][2] = new Array("Меню 3.1", "Меню 3.2", "Меню З.3", "Меню 3.4");
alert(menu[0][1]+"\n"+menu[0][2]+"\n"+menu[1][1][0]+"\n"+menu[1][2][3]);
//-->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
Текст этого документа можно взять здесь.

    Результат работы данного скрипта приведен на рисунке 1.


Рис.1. Результат работы скрипта


Разберите работу приведенного скрипта. Создайте HTML-документ, содержащий данный скрипт и выполните его в браузере.


    На следующем шаге мы рассмотрим копирование массивов.




Предыдущий шаг Содержание Следующий шаг