⚡ JavaScript

Массивы (списки) в JavaScript (Node.js): подробное руководство

Массивы (списки) в JavaScript

Что такое массив?

Представь, что у тебя есть коробка, в которую можно складывать разные предметы. Но в программировании мы храним не предметы, а данные: числа, строки (текст), или даже другие массивы. Массив (или список) — это такая «волшебная коробка», в которой можно хранить много значений под одним именем. Каждое значение лежит на своей полочке, и у каждой полочки есть номер — индекс.

Зачем это нужно? Допустим, ты записываешь температуру за неделю. Вместо того чтобы заводить семь разных переменных (temp1, temp2...), можно создать один массив temperatures и положить туда все значения. С массивом удобно работать: можно быстро найти нужный день, добавить новую температуру или посчитать среднюю.

Как создать массив

Самый простой способ — использовать квадратные скобки [].

// Пустой массив
let fruits = [];

// Массив с тремя фруктами
let fruits = ['яблоко', 'банан', 'апельсин'];

// Массив чисел
let heights = [100, 250, 400, 150];

Как получить элемент из массива

Нумерация элементов (индексы) начинается с нуля. Первый элемент — индекс 0, второй — индекс 1 и так далее.

let fruits = ['яблоко', 'банан', 'апельсин'];
console.log(fruits[0]); // 'яблоко'
console.log(fruits[2]); // 'апельсин'

Как изменить элемент

Просто присвой новое значение по индексу:

let fruits = ['яблоко', 'банан', 'апельсин'];
fruits[1] = 'киви'; // теперь массив: ['яблоко', 'киви', 'апельсин']
console.log(fruits);

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

Узнать, сколько элементов в массиве, поможет свойство length:

let fruits = ['яблоко', 'банан', 'апельсин'];
console.log(fruits.length); // 3

Добавление и удаление элементов

  • push(элемент) — добавляет элемент в конец массива.
  • pop() — удаляет последний элемент и возвращает его.
  • unshift(элемент) — добавляет элемент в начало.
  • shift() — удаляет первый элемент и возвращает его.
let fruits = ['яблоко', 'банан'];
fruits.push('апельсин'); // ['яблоко', 'банан', 'апельсин']
let last = fruits.pop(); // last = 'апельсин', массив: ['яблоко', 'банан']
fruits.unshift('киви');  // ['киви', 'яблоко', 'банан']
let first = fruits.shift(); // first = 'киви', массив: ['яблоко', 'банан']

Перебор массива (цикл for)

Часто нужно пройтись по всем элементам. Проще всего это сделать с помощью цикла for:

let fruits = ['яблоко', 'банан', 'апельсин'];
for (let i = 0; i < fruits.length; i++) {
  console.log('Фрукт номер ' + i + ': ' + fruits[i]);
}
// Вывод:
// Фрукт номер 0: яблоко
// Фрукт номер 1: банан
// Фрукт номер 2: апельсин

Разбор типичных задач

Задача «Фрукты» (составление списка)

Условие: каждый день приходят фрукты. Нужно собрать их в один общий список.

// Входные данные (представим, что мы вводим с клавиатуры)
let day1 = ['яблоко', 'груша'];
let day2 = ['банан', 'киви', 'яблоко'];
let day3 = ['апельсин'];

// Создаем пустой массив для общего списка
let allFruits = [];

// Добавляем все фрукты из каждого дня
for (let i = 0; i < day1.length; i++) {
  allFruits.push(day1[i]);
}
for (let i = 0; i < day2.length; i++) {
  allFruits.push(day2[i]);
}
for (let i = 0; i < day3.length; i++) {
  allFruits.push(day3[i]);
}

console.log('Все фрукты за неделю:', allFruits);
// Вывод: Все фрукты за неделю: ['яблоко', 'груша', 'банан', 'киви', 'яблоко', 'апельсин']

Задача «Робот-сортировщик» (отбор по условию)

Нужно выбрать детали с номерами больше 100.

let details = [45, 120, 89, 200, 34, 150];
let selected = [];

for (let i = 0; i < details.length; i++) {
  if (details[i] > 100) {
    selected.push(details[i]);
  }
}

console.log('Отобранные детали:', selected);
// Вывод: Отобранные детали: [120, 200, 150]

Задача «Запас материалов» (изменение элемента)

Нужно удвоить количество хлеба, которое находится на втором месте (индекс 1).

let supplies = ['хлеб', 10, 'молоко', 5, 'сыр', 3];
// Второй элемент (индекс 1) — это количество хлеба
supplies[1] = supplies[1] * 2;
console.log(supplies);
// Вывод: ['хлеб', 20, 'молоко', 5, 'сыр', 3]

Задача «Суп в школе» (сумма элементов)

Нужно посчитать, сколько всего порций супа было приготовлено за неделю.

let soupPortions = [30, 25, 40, 20, 35]; // по дням недели
let total = 0;

for (let i = 0; i < soupPortions.length; i++) {
  total = total + soupPortions[i];
}

console.log('Всего порций супа:', total);
// Вывод: Всего порций супа: 150

Задача «Юный альпинист» (поиск элементов больше заданного)

Нужно найти дни, когда высота была больше 300 метров.

let heights = [100, 350, 200, 500, 150];
let targetHeight = 300;

for (let i = 0; i < heights.length; i++) {
  if (heights[i] > targetHeight) {
    console.log('День ' + i + ': высота ' + heights[i] + ' м');
  }
}
// Вывод:
// День 1: высота 350 м
// День 3: высота 500 м

Частые ошибки новичков

  • Забывают, что индексы начинаются с 0. Если в массиве 5 элементов, то последний имеет индекс 4, а не 5.
  • Путают length с последним индексом. length — это количество элементов. Последний индекс всегда length - 1.
  • Выход за границы массива. Если попытаться получить fruits[10], а в массиве всего 3 элемента, JavaScript не выдаст ошибку, но вернет undefined. Это может привести к неожиданным результатам.
  • Забывают обновить счетчик в цикле. Если не написать i++, цикл станет бесконечным.
  • Путают push и pop. push добавляет, pop удаляет.

Итоговый пример: «Средняя температура за неделю»

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

// Входные данные (например, ввел пользователь)
let temps = [18, 22, 20, 25, 19, 23, 21];

// 1. Считаем сумму
let sum = 0;
for (let i = 0; i < temps.length; i++) {
  sum = sum + temps[i];
}

// 2. Вычисляем среднее
let average = sum / temps.length;
console.log('Средняя температура за неделю:', average);

// 3. Находим дни с температурой выше средней
console.log('Дни с температурой выше средней:');
for (let i = 0; i < temps.length; i++) {
  if (temps[i] > average) {
    console.log('День ' + (i + 1) + ': ' + temps[i] + '°C');
  }
}

// Вывод:
// Средняя температура за неделю: 21.142857142857142
// Дни с температурой выше средней:
// День 2: 22°C
// День 4: 25°C
// День 6: 23°C

Массивы — это мощный инструмент. Они помогают хранить и обрабатывать много данных одной командой. Потренируйся создавать свои массивы, добавлять и удалять элементы, а главное — не бойся экспериментировать!