JS метод Array.splice()

Опис

Метод splice() змінює вміст масиву, видаляючи або замінюючи існуючі елементи та/або додаючи нові елементи на вказане місце. Якщо кількість елементів, які потрібно вставити, не співпадає з кількістю елементів, які видаляються, довжина масиву відповідно змінюється.

Нижче наведено приклад використання методу splice():

let fruits = ["apple", "banana", "mango", "orange"];
fruits.splice(2, 1, "kiwi");
console.log(fruits); // Output: ["apple", "banana", "kiwi", "orange"]

У цьому прикладі ми замінюємо mango на kiwi. При цьому mango видаляється з масиву, а на його місце додається kiwi. Таким чином, результатом виконання коду буде масив ["apple", "banana", "kiwi", "orange"].

Зверніть увагу, що якщо видалена частина масиву була розрідженою, то масив, що повертається за допомогою splice(), також буде розрідженим, із відповідними порожніми слотами.

правити

Порада

Якщо ви хочете просто видалити елементи без додавання нових, ви можете передати тільки перший і другий аргументи. Наприклад, array.splice(2, 3) видалить 3 елементи починаючи з індексу 2.

автор: Bond правити

Порада

Метод splice() змінює вихідний масив і повертає масив, що містить видалені елементи. Це може бути корисно, якщо вам потрібно зберегти видалені елементи для подальшої обробки.

автор: Bond правити

Нотатка

Якщо видаляється лише один елемент, повертається масив з одним елементом. Якщо немає видалених елементів, повертається порожній масив.

автор: Bond правити

Нотатка

Метод splice() застосовується, коли потрібно змінити вміст масиву без створення нового масиву. Якщо ж ви бажаєте створити новий масив, видаливши або замінивши його сегмент, і при цьому не змінюючи оригінальний масив, використовуйте метод toSpliced(). Щоб отримати доступ до сегментів масиву без його змін, скористайтеся методом slice().

автор: Bond правити

Нотатка

splice() є універсальним методом, який очікує, що значення this матиме властивість length та цілочисельні властивості з ключами.

автор: Bond правити

Нотатка

Незважаючи на те, що структура рядків схожа на структуру масивів, цей метод не підходить для них, оскільки рядки в JavaScript є незмінними.

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

splice(start)
splice(start, deleteCount)
splice(start, deleteCount, item0)
splice(start, deleteCount, item0, item1)
splice(start, deleteCount, item0, item1, /* … ,*/ itemN)

Параметри

start

Нульовий індекс (перетворений в ціле число), з якого починається зміна масиву.

• Негативний індекс відлічується від кінця масиву - якщо start < 0, використовується start + array.length.
• Якщо start < -array.length, використовується 0.
• Якщо start >= array.length, жоден елемент не буде видалено, але метод поведе себе як функція додавання, додавши стільки елементів, скільки надано.
• Якщо start не вказано (і метод splice() викликається без аргументів), нічого не видаляється. Це відрізняється від передачі undefined, яке перетворюється на 0.

автор: Bond

правити

deleteCount

Ціле число, що вказує кількість елементів, які слід видалити з масиву починаючи з позиції start.

Якщо deleteCount не вказано, або якщо його значення більше або дорівнює кількості елементів після позиції, вказаної в start, то всі елементи від start до кінця масиву будуть видалені.

Якщо deleteCount дорівнює 0 або є від'ємним, жоден елемент не видаляється.

автор: Bond

правити

item0, …, itemN

Елементи, які додаються до масиву, починаючи з позиції start. Якщо ви не вказуєте жодних елементів, метод splice() буде лише видаляти елементи з масиву.

автор: Bond

правити

Повернення

array

Масив, що містить видалені елементи.

автор: Bond

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі Серверні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	1	1	1	4	12

Підтримка: мобільні переглядачі

Переглядач
	4.4	18	4	1

Підтримка: серверні переглядачі

Переглядач
	0.10.0	1.0

Приклади

+ запропонувати свій приклад у пісочниці

const myFish = ["parrot", "anemone", "blue", "trumpet", "sturgeon"];
const removed = myFish.splice(2, 2);

// myFish стає ["parrot", "anemone", "sturgeon"]
// removed стає ["blue", "trumpet"]

const arr = [1, , 3, 4, , 6];
console.log(arr.splice(1, 2)); // [empty, 3]
console.log(arr); // [1, 4, empty, 6]

const myFish = ["angel", "clown", "mandarin", "sturgeon"];
const removed = myFish.splice(2, 0, "drum");

// myFish стає ["angel", "clown", "drum", "mandarin", "sturgeon"]
// removed стає [], жоден елемент не було видалено

const myFish = ["angel", "clown", "drum", "mandarin", "sturgeon"];
const removed = myFish.splice(3, 1);

// myFish стає ["angel", "clown", "drum", "sturgeon"]
// removed стає ["mandarin"]

const arrayLike = {
  length: 3,
  unrelated: "foo",
  0: 5,
  2: 4,
};
console.log(Array.prototype.splice.call(arrayLike, 0, 1, 2, 3));
// [ 5 ]
console.log(arrayLike);
// { '0': 2, '1': 3, '3': 4, length: 4, unrelated: 'foo' }