Масиви — це структури даних, призначені для зберігання та обробки колекцій значень.

Створення масивів

• Масиви в JavaScript створюються за допомогою квадратних дужок [] і називаються літералами масиву;
• Елементи масиву розділяються комами.

// Array literal creation
const colors = ["red", "green", "blue"];
const numbers = [1, 2, 3, 4, 5];

// Arrays with different data types
const mixedArray = ["apple", 42, true, { name: "John" }];

Доступ до елементів масиву

• Індексація масиву починається з 0, тобто перший елемент має індекс 0, другий — індекс 1 і так далі;
• Доступ до конкретних елементів масиву здійснюється за допомогою квадратних дужок із зазначенням індексу елемента.

const firstColor = colors[0]; // "red"
const secondNumber = numbers[1]; // 2

Зміна елементів масиву

Елементи масиву можна змінювати, звертаючись до них за індексом і присвоюючи нове значення.

colors[1] = "yellow";
numbers[0] = 10;

Довжина масиву

Властивість length масиву відображає кількість елементів у ньому. Вона автоматично змінюється при додаванні або видаленні елементів.

const colorsCount = colors.length; // 3
const numbersCount = numbers.length; // 5

Пошук останнього елемента

Щоб отримати значення останнього елемента масиву, можна обчислити його індекс за допомогою властивості довжини масиву, тобто array.length - 1.

const lastColor = colors[colors.length - 1];
const lastNumber = numbers[numbers.length - 1];

Цикл for

• Цикл for використовується для поелементного перебору масиву;
• Використовує змінну-лічильник (наприклад, i) для доступу до кожного елемента за індексом;
• Цикл триває, поки лічильник менший за довжину масиву;
• Є базовим інструментом для ітерації по масиву.

for (let i = 0; i < numbers.length; i+=1) {
  console.log(numbers[i]);
}

Цикл For...of

• Цикл for...of — це сучасніший і лаконічніший спосіб ітерування масивів;
• Автоматично керує лічильником циклу та надає прямий доступ до значення кожного елемента;
• Спрощує ітерування масиву, роблячи код чистішим і зрозумілішим.

for (const color of colors) {
  console.log(color);
}