JavaScript Методи масиву
Перетворення (конвертація) масивів в рядки
JavaScript метод toString()
конвертує масив в рядок (розділених комами) значень масиву.
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();
Результат:
Метод join()
також об’єднує всі елементи масиву в рядок.
Він поводить себе так само, як toString()
, але, крім того, ви можете вказати роздільник:
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * ");
Результат:
Popping та Pushing
Коли ви працюєте з масивами, легко видаляти елементи та додавати нові елементи.
Ось що таке popping (витягування) та pushing (виштовхування):
Витягування (popping) елементів із масиву, або виштовхування (pushing) елементів в масив.
JavaScript Array pop()
Метод pop()
видаляє останній елемент із масиву:
Метод pop()
повертає значення, яке було "витягнуто":
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits.pop();
Спробуйте самі »
JavaScript Array push()
Метод push()
додає новий елемент в масив (в кінці):
Метод push()
повертає нову довжину масиву:
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let length = fruits.push("Kiwi");
Спробуйте самі »Здвиг (шифтинг) елементів
Здвиг (шифтинг) еквівалентний popping (виштовхуванню), працюючи з першим елементом замість останнього.
JavaScript Array shift()
Метод shift()
видаляє перший елемент масиву та "здвигає" всі інші елементи з більш низьким індексом.
Метод shift()
повертає значення, яке було "здвинуто":
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits.shift();
Спробуйте самі »
JavaScript Array unshift()
Метод unshift()
додає новий елемент в масив (на початку) та "відміняє здвиг" старих елементів:
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");
Спробуйте самі »
Метод unshift()
повертає нову довжину масиву.
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");
Спробуйте самі »
Зміна елементів
Доступ до елементів масиву здійснюється за їхніми числовими індексами (порядковими номерами):
Індекси масиву починаються з 0:
[0] - це перший елемент масиву
[1] - це другий елемент масиву
[2] - це третій елемент масиву і т.д.
JavaScript Array length
Властивість length
надає простий спосіб додати новий елемент в масив:
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Kiwi";
Спробуйте самі »
JavaScript Array delete()
УВАГА!
Елементи масиву можуть бути видалені з використанням JavaScript оператору delete
.
Використання delete
залишає undefined
прогалини в масиві.
Використовуйте pop() або shift() замість цього.
Злиття (конкатенація) масивів
Метод concat()
створює новий масив шляхом злиття (конкатенації, об’єднання) існуючих масивів:
Приклад (злиття двох масивів)
const myGirls = ["Cecilie", "Lone"];
const myBoys = ["Emil", "Tobias", "Linus"];
const myChildren = myGirls.concat(myBoys);
Спробуйте самі »
Метод concat()
не змінює існуючи масиви. Він завжди повертає новий масив.
Метод concat()
може приймати будь-яку кількість аргументів масиву:
Приклад (злиття трьох масивів)
const arr1 = ["Cecilie", "Lone"];
const arr2 = ["Emil", "Tobias", "Linus"];
const arr3 = ["Robin", "Morgan"];
const myChildren = arr1.concat(arr2, arr3);
Спробуйте самі »
Метод concat()
також може приймати рядки як аргументи:
Приклад (злиття масиву зі значеннями)
const arr1 = ["Emil", "Tobias", "Linus"];
const myChildren = arr1.concat("Peter");
Спробуйте самі »
Складання та вирізання масивів
Метод splice()
додає нові елементи в масив.
Метод slice()
вирізає частину масиву.
JavaScript Array splice()
Метод splice()
може використовуватись для додавання нових елементів в масив:
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");
Спробуйте самі »
Перший параметр (2) визначає позицію, куди мають бути додані (вставлені) нові елементи.
Другий параметр (0) визначає, скільки елементів мають бути видалені.
Інші параметри ("Lemon" , "Kiwi") визначають нові елементи, що будуть додані.
Метод splice()
повертає масив із видаленими елементами:
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 2, "Lemon", "Kiwi");
Спробуйте самі »
Використання splice() для видалення елементів
Завдяки розумному налаштуванню параметрів, ви можете використовувати splice()
для видалення елементів без залишених "прогалин" в масиві:
Перший параметр (0) визначає позицію, куди мають бути додані (вставлені) нові елементи.
Другий параметр (1) визначає, скільки елементів мають бути видалені.
Інші параметри опущені. Нові елементи додаватись не будуть.
JavaScript Array slice()
Метод slice()
нарізає частину масиву в новий масив.
В цьому прикладі вирізується частина масиву, починаючи з елемента 1 масиву ("Orange"):
Приклад
const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const citrus = fruits.slice(1);
Спробуйте самі »
Примітка
Метод slice()
створює новий масив.
Метод slice()
не видаляє які-небудь елементи із початкового масиву.
В цьому прикладі вирізується частина масиву, починаючи з елементу 3 масиву ("Apple"):
Приклад
const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const citrus = fruits.slice(3);
Спробуйте самі »
Метод slice()
може приймати два аргументи, наприклад slice(1, 3)
.
Потім метод обирає елементи із початкового аргумента і до кінцевого аргумента (але не включаючи його).
Приклад
const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const citrus = fruits.slice(1, 3);
Спробуйте самі »
Якщо кінцевий аргумент опущений, як в перших прикладах, метод slice()
вирізує іншу частину масиву.
Приклад
const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const citrus = fruits.slice(2);
Спробуйте самі »
Автоматичний toString()
JavaScript автоматично конвертує масив в рядок, розділений комами, коли очікується примітивне значення.
Це завжди так, коли ви намагаєтесь вивести масив.
Ці два приклади дадуть однаковий результат:
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();
Спробуйте самі »
Приклад
const fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits;
Спробуйте самі »
Примітка
Всі JavaScript об’єкти мають метод toString().
Пошук максимального та мінімального значень в масиві
Немає вбудованих функцій для пошуку найбільшого і найменшого значень в JavaScript масиві.
Ви дізнаєтесь, як розв’язати цю проблему в наступному розділі цього підручника на нашому сайті.
Сортування масивів
Сортування масивів розглядаються в наступному розділі цього підручника.
Повний довідник масиву
Для більш детального ознайомлення з масивами відвідайте:
Повний довідник JavaScript масиву на нашому сайті W3Schools українською.
Довідник містить описи та приклади всіх властивостей та методів масиву.