JavaScript для детей

скобки с индексом нужного вам элемента, как в этом примере:

dinosaurs[0];

"Тираннозавр"

dinosaurs[3];

"Трицератопс"

Индекс — это номер элемента, в котором хранится значение.

Аналогично символам в строке, первому элементу массива соответствует

индекс 0, второму — 1, третьему — 2 и т. д. Поэтому, запросив индекс

0 в массиве dinosaurs, мы получили "Тираннозавр" (это первый эле-

мент), а запросив индекс 3 — "Трицератопс" (четвертый элемент).

Возможность доступа к отдельным элементам массива очень полез-

на. Например, если вы хотите показать кому-то самого-самого любимого

своего динозавра, ни к чему показывать весь массив. Вместо этого про-

сто возьмите первый элемент:

dinosaurs[0];

"Тираннозавр"

52 Часть I. Основы

Создание и изменение элементов

Используя индекс в квадратных скобках, можно задавать или изме-

нять значения элементов и даже добавлять новые элементы. Например,

чтобы заменить содержимое первого элемента массива dinosaurs

("Тираннозавр") на "Тираннозавр рекс", можно написать:

dinosaurs[0] = "Тираннозавр рекс";

После этого массив dinosaurs станет таким:

["Тираннозавр рекс", "Велоцираптор", "Стегозавр", "Трицератопс", 

"Брахиозавр", "Птеранодон", "Апатозавр", "Диплодок", 

"Компсогнат”]

С помощью индексов также можно добавлять в массив элементы.

Например, вот как создать массив dinosaurs, задавая каждый элемент

через квадратные скобки:

var dinosaurs = [];

dinosaurs[0] = "Тираннозавр";

dinosaurs[1] = "Велоцираптор";

dinosaurs[2] = "Стегозавр";

dinosaurs[3] = "Трицератопс";

dinosaurs[4] = "Брахиозавр";

dinosaurs[5] = "Птеранодон";

dinosaurs[6] = "Апатозавр";

dinosaurs[7] = "Диплодок";

dinosaurs[8] = "Компсогнат";

dinosaurs;

["Тираннозавр", "Велоцираптор", "Стегозавр", "Трицератопс", 

"Брахиозавр", "Птеранодон", "Апатозавр", "Диплодок", 

"Компсогнат”]

Сначала создаем пустой массив: var dinosaurs = []. Затем

в каждой из следующих строк добавляем по одному элементу коман-

дами dinosaurs[] с индексом от 0 до 8. Закончив наполнение мас-

сива, можно посмотреть его содержимое (набрав dinosaurs;) и убе-

диться, что JavaScript расположил значения по порядку, в соответствии

с индексами.

3. Массивы 53

На самом деле в массив можно добавить элемент с любым индексом.

Например, чтобы добавить нового (выдуманного) динозавра с индексом 33,

введем:

dinosaurs[33] = "Филосораптор";

dinosaurs;

["Тираннозавр", "Велоцираптор", "Стегозавр", "Трицератопс", 

"Брахиозавр", "Птеранодон", "Апатозавр", "Диплодок", 

"Компсогнат", undefined × 24 "Филосораптор"]

Элементы между индексами 8 и 33 получат значение undefi ned. При

печати массива Chrome сообщает количество этих undefi ned-элементов,

а не выводит каждый из них по отдельности.

Разные типы данных в одном массиве

Не обязательно, чтобы все элементы массива были одного типа. Например,

вот массив, в котором хранится число (3), строка ("динозавры"), массив

(["трицератопс", "стегозавр", 3627.5]) и еще одно число (10):

var dinosaursAndNumbers = [3, "динозавры", ["трицератопс", 

Dinosaurs

"стегозавр", 3627.5], 10];

and numbers —

динозавры

и числа

Чтобы обратиться к элементам массива, вложенного в другой мас-

сив, нужно использовать вторую пару квадратных скобок. Например,

если команда dinosaursAndNumbers[2]; вернет весь вложенный мас-

сив, то dinosaursAndNumbers[2][0]; — лишь первый элемент этого

вложенного массива ("трицератопс").

dinosaursAndNumbers[2];

["трицератопс", "стегозавр", 3627.5]

dinosaursAndNumbers[2][0];

"трицератопс"

индекс

индекс

индекс

индекс

[0]

[1]

[2]

[3]

[3, "динозавры", ["трицератопс", "стегозавр", 3627.5], 10];

индекс

индекс

индекс

[2][0]

[2][1]

[2][2]

Рис. 3.1. Индексы основного массива показаны красным цветом, а индексы вложенного

массива — синим

54 Часть I. Основы

Вводя dinosaursAndNumbers[2][0];, мы просим JavaScript обра-

титься к индексу 2 массива dinosaursAndNumbers, где находится

массив ["трицератопс", "стегозавр", 3627.5], и вернуть значе-

ние с индексом 0 из этого вложенного массива — это первый элемент,

"трицератопс". На рис. 3.1 показаны индексы для этих массивов.

Работаем с массивами

Работать с массивами вам помогут свойства и методы. Свойства хранят

различные сведения о массиве, а методы обычно либо изменяют его,

либо возвращают новый массив. Давайте разберемся.

Длина массива

Порой нужно знать, сколько в массиве элементов. Например, если снова

и снова добавлять динозавров в массив dinosaurs, вы можете забыть,

сколько их теперь всего.

Для этого есть свойство length (длина), хранящее количество эле-

ментов в массиве. Чтобы узнать длину массива, просто добавьте .length

после его имени. Давайте посмотрим, как это работает. Но сначала соз-

дадим новый массив с тремя элементами:

var maniacs = ["Якко", "Вакко", "Дот"];

Якко, Вакко

maniacs[0];

и Дот — герои

"Якко"

мультсериала

maniacs[1];

«Озорные ани-

"Вакко"

машки» (англ.

maniacs[2];

Animaniacs)

"Дот"

о семейке

Уорнер, соз-

данного ком-

Чтобы узнать длину этого массива, добавим .length к maniacs:

панией Warner

Bros.

maniacs.length;

3

JavaScript сообщает, что в массиве 3 элемента, и мы знаем, что их