Массивы в JavaScript
Прошлая страница держала факты в тексте, который потом можно отправить. Здесь список остаётся живым внутри скрипта, и ячейки можно переписать. Три названия цветов стоят по порядку. На ячейку показывают номером, а не ключом.
Полка, а не записка
Квадратные скобки собирают список, пока скрипт работает, и каждое значение сидит в нумерованной ячейке. Это не текст JSON, который ждёт parse, и не объект с именованными полями. Смысл этой формы в порядке ячеек.
Имя против номера
📊 Именованный объект против нумерованного массива
| Вопрос | Объект | Массив |
|---|---|---|
| Как указать | ключ вроде name | индекс вроде 0 |
| Первый цвет | не список цветов | colors[0] |
| Сколько | ключи считаете сами | length |
| Порядок | не суть | суть |
| После страницы JSON | записка о данных | живой список в скрипте |
Объект спрашивает, какое имя имеется в виду, массив спрашивает, какое место. Первый цвет это colors[0], без ключа. Класть объект внутрь ячейки — привычка следующих уроков, не этой страницы.
Скобки квадратные, не фигурные
Фигурные скобки открывают объект, квадратные открывают массив. Три названия цветов — это три ячейки подряд. Кружка с прошлого урока была именованным полем, не списком. Когда нужен только список, оставляйте квадратные скобки.
let colors = ["red", "green", "blue"];
console.log(colors[0]);
Первая ячейка имеет индекс 0
colors[0] печатает red. Счёт идёт с нуля, не с единицы. Начнёте с единицы — пропустите красный. Вторая ячейка это green, третья это blue.
let colors = ["red", "green", "blue"];
console.log(colors.length);
console.log(colors[colors.length - 1]);
length считает ячейки
colors.length равен 3, потому что сохранены три имени, и последняя ячейка colors[colors.length - 1] это blue. Единицу вычитают, потому что первый индекс ноль, а не один. length — свойство, и скобки вызова ему не нужны.
let colors = ["red", "green", "blue"];
colors[1] = "gold";
console.log(colors[1]);
console.log(colors.length);
Замена не меняет количество
colors[1] = "gold" пишет поверх green. Следующее чтение этой ячейки печатает gold. length остаётся 3. Изменилась ячейка, которая уже была, новая не добавилась. Добавлять и убирать ячейки будет урок про методы массивов.
let colors = ["red", "green", "blue"];
console.log(colors[9]);
console.log(colors.length);
Пустой индекс — не новая ячейка
colors[9] ничего не хранит, поэтому чтение даёт undefined, а length всё ещё 3. Чтение пустой ячейки не удлиняет список. Запись за концом увеличивает длину и оставляет дыры, и это не инструмент этой страницы.
let bag = ["red", 12, true];
console.log(bag[1]);
console.log(typeof bag[0]);
Один вид значения читается легче
В ячейке может лежать строка, число или boolean. bag[1] печатает 12, а typeof bag[0] равен string. Список цветов яснее смешанного мешка. Язык смесь не запрещает.
Покажите первый цвет на странице
Прочитайте индекс 0 и запишите эту строку в абзац. Два других цвета пусть останутся в списке.
<!DOCTYPE html>
<html>
<head>
<title>arrays — page</title>
</head>
<body>
<p id="line">…</p>
<script>
let colors = ["red", "green", "blue"];
let box = document.getElementById("line");
box.textContent = colors[0];
</script>
</body>
</html>
Абзац показывает red. Поменяйте только первую строку внутри скобок и обновите страницу — строка последует за ней. Два других цвета остаются в памяти и в абзац не пишутся.
Шаги практики
- Создайте три цвета и прочитайте индекс 0, затем длину, и дойдите до последнего цвета через длину минус один.
- Поставьте индекс 1 в
goldи прочитайте эту ячейку и длину. - Прочитайте индекс 9 и убедитесь, что длина всё ещё 3, а в смешанном мешке посмотрите число и тип первой ячейки.
- В HTML-примере смените только первый цвет, обновите страницу и прочитайте абзац.
Частые срывы
- Считать с единицы и пропустить первый цвет, и вызывать
lengthсо скобками, будто это функция - Принять массив за текст
JSONи отдать его вparse - Ждать, что одно чтение пустого индекса увеличит
length, или что замена ячейки означает новый элемент - Искать методы массивов уже на этой странице
Коротко
- Массив — живой список внутри скрипта, и квадратные скобки его создают
- Индекс 0 — первый элемент
lengthсчитает ячейки и не берёт скобки вызова- Запись в существующий индекс заменяет эту ячейку, а чтение за концом даёт
undefinedбез смены длины - Первый элемент может заполнить строку на странице, а дальше идут методы массивов: добавить и убрать ячейки
🧠 Проверьте Свои Знания
Проверьте Свои Знания
Бросьте себе вызов с помощью этой интерактивной викторины и узнайте, насколько хорошо вы понимаете тему
📝 Инструкции
- Внимательно прочитайте каждый вопрос
- Выберите лучший ответ на каждый вопрос
- Вы можете пересдавать тест столько раз, сколько захотите
- Ваш прогресс будет показан вверху