The splice() method changes the contents of an array by removing or replacing existing elements and/or adding new elements in place .

The source for this interactive example is stored in a GitHub repository. If you"d like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

Syntax let arrDeletedItems = array .splice(start [, deleteCount [, item1 [, item2 [, ...]]]]) Parameters start The index at which to start changing the array. If greater than the length of the array, start will be set to the length of the array. If negative, it will begin that many elements from the end of the array. (In this case, the origin -1 , meaning - n is the index of the n th last element, and is therefore equivalent to the index of array .length - n .) If array .length + start is less than 0 , it will begin from index 0 . deleteCount Optional An integer indicating the number of elements in the array to remove from start . If deleteCount is omitted, or if its value is equal to or larger than array .length - start (that is, if it is equal to or greater than the number of elements left in the array, starting at start), then all the elements from start to the end of the array will be deleted.

Note: In IE8, it won"t delete all when deleteCount is omitted.

If deleteCount is 0 or negative, no elements are removed. In this case, you should specify at least one new element (see below). item1 , item2 , ... Optional The elements to add to the array, beginning from start . If you do not specify any elements, splice() will only remove elements from the array.

Return value

An array containing the deleted elements.

If only one element is removed, an array of one element is returned.

If no elements are removed, an empty array is returned.

Description

If the specified number of elements to insert differs from the number of elements being removed, the array"s length will be different at the end of the call.

Examples Remove 0 (zero) elements from index 2, and insert "drum" let myFish = ["angel", "clown", "mandarin", "sturgeon"] let removed = myFish.splice(2, 0, "drum") // myFish is ["angel", "clown", "drum", "mandarin", "sturgeon"] // removed is , no elements removed Remove 0 (zero) elements from index 2, and insert "drum" and "guitar" let myFish = ["angel", "clown", "mandarin", "sturgeon"] let removed = myFish.splice(2, 0, "drum", "guitar") // myFish is ["angel", "clown", "drum", "guitar", "mandarin", "sturgeon"] // removed is , no elements removed Remove 1 element from index 3 let myFish = ["angel", "clown", "drum", "mandarin", "sturgeon"] let removed = myFish.splice(3, 1) // removed is ["mandarin"] // myFish is ["angel", "clown", "drum", "sturgeon"] Remove 1 element from index 2, and insert "trumpet" let myFish = ["angel", "clown", "drum", "sturgeon"] let removed = myFish.splice(2, 1, "trumpet") // myFish is ["angel", "clown", "trumpet", "sturgeon"] // removed is ["drum"] Remove 2 elements from index 0, and insert "parrot", "anemone" and "blue" let myFish = ["angel", "clown", "trumpet", "sturgeon"] let removed = myFish.splice(0, 2, "parrot", "anemone", "blue") // myFish is ["parrot", "anemone", "blue", "trumpet", "sturgeon"] // removed is ["angel", "clown"] Remove 2 elements from index 2 let myFish = ["parrot", "anemone", "blue", "trumpet", "sturgeon"] let removed = myFish.splice(2, 2) // myFish is ["parrot", "anemone", "sturgeon"] // removed is ["blue", "trumpet"] Remove 1 element from index -2 let myFish = ["angel", "clown", "mandarin", "sturgeon"] let removed = myFish.splice(-2, 1) // myFish is ["angel", "clown", "sturgeon"] // removed is ["mandarin"] Remove all elements after index 2 (incl.) let myFish = ["angel", "clown", "mandarin", "sturgeon"] let removed = myFish.splice(2) // myFish is ["angel", "clown"] // removed is ["mandarin", "sturgeon"] Specifications Specification Status Comment

ECMAScript Latest Draft (ECMA-262)	Draft
ECMAScript 2015 (6th Edition, ECMA-262) The definition of "Array.prototype.splice" in that specification.	Standard
ECMAScript 5.1 (ECMA-262) The definition of "Array.prototype.splice" in that specification.	Standard
ECMAScript 3rd Edition (ECMA-262)	Standard	Initial definition. Implemented in JavaScript 1.2.

Browser compatibility

The compatibility table in this page is generated from structured data. If you"d like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

Update compatibility data on GitHub

Desktop Mobile Server Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet Node.js splice

Chrome Full support 1

Edge Full support 12

Firefox Full support 1

IE Full support 5.5 Notes Full support 5.5 Notes Notes From Internet Explorer 5.5 through 8, all elements of the array will not be deleted if deleteCount is omitted. This behavior was fixed in Internet Explorer 9.

Opera Full support Yes

Safari Full support 1

WebView Android Full support Yes

Chrome Android Full support 18

Firefox Android Full support 4

Opera Android Full support Yes

Safari iOS Full support 1

Samsung Internet Android Full support Yes

nodejs Full support Yes

Legend Full support Full support See implementation notes. See implementation notes.

В JavaScript так же как и в других языках программирования для работы с массивами применяются разные методы.

Методы упрощают построение логики и её реализации в скрипте.

Ниже приведены базовые методы для работы с массивами в JS.

push

Метод push() добавляет значение в конец массива.

Let arr = ; arr.push(312); console.log(arr); // →

pop

Метод pop() удаляет последний элемент из массива или возвращает его значение.

Let arr = ; arr.pop(); console.log(arr); // →

Используя возможность получить значение последнего элемента массива, как пример, мы можем получить формат изображения:

Let img = "https://example.com/img/name.png"; let format = img.split(".").pop(); console.log(format); // → png console.log(img.split(".")); // → ["https://example", "com/img/name", "png"]

unshift

Метод unshift() добавляет элемент в начало массива.

Let arr = ; arr.unshift(312); console.log(arr); // →

shift

Метод shift() удаляет первый элемент из массива.

Let arr = ; arr.shift(); console.log(arr); // → ;

Нужно понимать, что при применении методов shift и unshift у каждого элемента массива изменяется его индекс. Это может замедлять выполнение программы если массив имеет большую длину.

split

Метод split() применяется для трансформации строки в массив. Split разделяет строку (string) по указаному параметру.

Let str = "Аня, Маша, Саша, Даша"; // это строка let arr = str.split(", "); console.log(arr); // → ["Аня", "Маша", "Саша", "Даша"] - это массив

join

Метод join() объединяет элементы массива в строку, через указанный в параметре разделитель.

Let arr = ["Notpad++", "Sublime", "VSCode"]; // это массив let str = arr.join(", "); console.log("Редакторы для кода: " + str); // → "Редакторы для кода: Notpad++, Sublime, VSCode"

slice

Метод slice() создаёт новый массив, в который копирует элементы из источника начиная с элемента c индексом первого параметра переданного в метод, до элемента с индексом второго параметра.

Например: slice(3, 7) вернёт элементы с индексами 3, 4, 5, 6. Элемент с индексом 7 не войдёт в массив.

Если в slice() передан параметр с отрицательным значением, то он возвращает новый массив с количеством элементов указанных в параметре, но уже взятых с конца исходного массива.

Метод slice не изменяет исходный массив.

Вот несколько примеров работы метода slice() :

Let arr = ["A", "B", "C", "D", "E", "F", "G"]; // Вернёт массив в котором будут элементы с индексами от 2 до 5 console.log(arr.slice(2, 5)); // → ["C", "D", "E"] // Вернёт новый массив в котором будут элементы с индексами от 3 до arr.length console.log(arr.slice(3)); // → ["D", "E", "F", "G"] // Вернёт копию исходного массива console.log(arr.slice()); // → ["A", "B", "C", "D", "E", "F", "G"] // Вернёт новый массив состоящий из последних трёх элементов исходного console.log(arr.slice(-3)); // → ["E", "F", "G"]

splice

Метод splice() изменяет содержимое массива, удаляя существующие элементы и/или добавляя новые.

Синтаксис:

Array.splice(start, deleteCount[, item1[, item2[, ...]]])

Параметры:

• start - Индекс, по которому начинать изменять массив. Если больше длины массива, реальный индекс будет установлен на длину массива. Если отрицателен, указывает индекс элемента с конца.
• deleteCount - Целое число, показывающее количество старых удаляемых из массива элементов. Если deleteCount равен 0, элементы не удаляются. В этом случае вы должны указать как минимум один новый элемент. Если deleteCount больше количества элементов, оставшихся в массиве, начиная с индекса start , то будут удалены все элементы до конца массива.
• itemN - Необязательные параметры. Добавляемые к массиву элементы. Если вы не укажете никакого элемента, splice() просто удалит элементы из массива.

Возвращаемое значение Описание

Если количество указанных вставляемых элементов будет отличным от количества удаляемых элементов, массив изменит длину после вызова.

Let arr = ["Барса", "Шахтёр", "МЮ", "Милан", "Реал", "Аякс", "Ювентус"]; let nax = arr.splice(2, 3); arr.splice(2, 3); console.log(nax); // → ["МЮ", "Милан", "Реал"] console.log(arr); // → ["Барса", "Шахтёр"] arr.splice(1, 0, "Зенит", "ЦСКА", "Спартак"); console.log(arr); // → ["Барса", "Зенит", "ЦСКА", "Спартак", "Шахтёр"]

reverse

Метод reverse() меняет порядок элементов массива на обратный. В результате первый элемент массива становится последним, а последний элемент - первым.

Let arr = ; console.log(arr.reverce()); // → console.log(["Алиса", "БГ", "ГО", "ДДТ"].reverce()); // → ["ДДТ", "ГО", "БГ", "Алиса"]

map

Метод map() проходит по элементам массива производя с ними заданные действия и возвращает копию массива с изменёнными элементами.

В примере ниже к каждому элементу массива прибавим значение индекса этого элемента (7 + 0, 2 + 1, 15 + 2, 4 + 3, 31 + 4):

Let arr = ; let testMap = arr.map((element, index) => element + index); console.log(testMap); //

или каждое значение массива умножим к примеру на 12

Let arr = ; let testMap = arr.map(a => a * 12); console.log(testMap); // →

filter

Метод filter() используется для фильтрации массивов. Он проходит по массиву, возвращая только те элементы, которые проходят заданное условие.

Например отфильтруем значения массива из чисел оставив только те, которые больше 21

Let arr = ; let testFilter = arr.filter(element => element > 21); console.log(testFilter); // →

Обратите внимание, что 21 не вошло в результат массива, так как условие было вернуть то что больше 21. Чтобы и 21 вошло в массив, то условие ставим как больше или равно: element >= 21

Среди JavaScript разработчиков распространено непонимание разницы между этими двумя методами. Знаете ли вы в чем отличие slice от splice ?

Оба эти метода предназначены для разбиения массива JavaScript на части, но не понимание когда нужно использовать slice , а когда splice ведет к трудно-отлавливаемым ошибкам. Давайте рассмотрим каждый из двух методов по отдельности, тогда разница станет очевидна.

Slice - режем и создаем

Английский глагол slice переводится как "резать". Честно говоря, не понимаю чем руководствовались разработчики спецификации, но полагаться на перевод слов в JS нельзя. Согласно спецификации ECMAScript 5.1, метод slice принимает два аргумента: начальный и конечный индексы. Затем создается новый массив содержащий элементы старого от начального индекса до конечного. Самое важное - всегда создается новый массив, т.е. массив к которому был применен метод останется прежним. Так же не забывайте, что вторым параметром указывается не количество элементов, а конечный индекс, поэтому второй параметр всегда должен быть больше первого, иначе вернется пустой массив. Рассмотрим примеры.

Var a = ; console.log(a); // var b = a.slice(3, 5); console.log(a); // console.log(b); // var c = a.slice(4, 2); console.log(a); // console.log(c);//

Как обычно в JS, нужно просто запомнить, что slice вернет вам элементы начиная с указанного начального индекса (включая сам этот элемент ) и до указанного конечного индекса, но без конечного элемента .

Splice - режем и делим

С английского splice - сращивать. Опять же не видно связи между глаголом и действиями метода. Основное отличие splice в том, что он изменяет исходный массив. Метод все так же принимает начальный и конечный индекс, однако важно помнить, что ваш исходный массив лишится обрезанных элементов.

Var a = ; console.log(a); // var b = a.splice(3, 5); console.log(a); // console.log(b); // var c = a.splice(4, 2); console.log(a); // console.log(c); //

И снова нужно просто запомнить, что splice урежет исходный массив с указанного начального индекса (включая сам элемент ) и до указанного конечного индекса (тоже включая сам элемент ). При этом метод возвращает все отрезанные элементы и вы можете сохранить их отдельно.

Так же метод splice удобно использовать для удаления элементов массива. Напомню, что обычный delete a; не удалит сам элемент, а установит его в undefined. Чтобы удалить элемент лучше всего использовать a.splice(1, 1);

Var a = ; delete a; console.log(a); // var a = ; a.splice(1, 1); console.log(a); //

Замечу, что в последней версии Google Chrome консоль в первом случае покажет вам такой результат: . Вероятно, она просто не отобразила undefined-элемент, т.к. на самом деле удаления не произошло.

Определение и применение

JavaScript метод splice() позволяет изменить содержимое массива за счёт удаления существующих элементов, и/или добавления новых элементов в массив.

Обращаю Ваше внимание, что метод splice() изменяет существующий массив, а не возвращает новый. Удаленные элементы возвращаются как новый объект Array .

Поддержка браузерами Метод
Opera
IExplorer
Edge

splice()	Да	Да	Да	Да	Да	Да

JavaScript синтаксис: // только с указанием индекса array .splice(start ) // с указанием индекса и количества удаляемых элементов array .splice(start , deleteCount ) // с указанием индекса, количества удаляемых элементов и с добавлением элементов array .splice(start , deleteCount , element1 , element2 , ..., elementX ) Версия JavaScript ECMAScript 3 (реализовано в JavaScript 1.2) Значения параметров Параметр Описание

start	Целое число, определяющее индекс массива, с которого будут удалены из массива и/или добавлены в массив элементы. Допускается использование отрицательных значений , в этом случае индекс с которого будет вызван метод будет расчитан по следующей формуле: length (длина массива) + start . Является обязательным значением.
deleteCount	Целое число, определяющее количество удаляемых из массива элементов, начииная с индекса указанного в start . Если deleteCount равен 0, то элементы не удаляются. Если значение deleteCount больше количества оставшихся элементов в массиве, то все оставшиеся элементы массива будут удалены. Необязательное значение, отрицательные значения не допускаются .
element (-s)	Элемент, или элементы, которые будут добавлены к массиву. Индекс массива по которому будут вставлены новые элементы соответствует параметру start . Необязательное значение .

Пример использования var x = ; // инициализируем переменную, содержащую массив x.splice(3 ); x.splice(-3 ); // значение переменной x.splice(2 , 2 ); // значение переменной x.splice(-2 , 2 ); // значение переменной x.splice(0 , 2 , "z ", true ); // значение переменной ["z", true, 3, "a", "b", "c"] x.splice(3 , 0 , "z ", "z ", "z "); // значение переменной М етод splice() в массивах Javascript изменяет содержимое массива, добавляя новые элементы, удаляя старые.Синтаксис

Его синтаксис выглядит следующим образом:

Array.splice(index, howMany, [, ..., elementN]);

Детали параметров

• index – Индекс, с которого начинается изменение массива.
• howMany – Целое число, указывающее количество удаляемых старых элементов массива. Если howMany равно 0, элементы не удаляются.
• element1, …, elementN – Элементы, добавляемые в массив. Если вы не указываете никаких элементов, splice просто удаляет элементы из массива.

Возвращаемое значение

Возвращает извлеченный массив на основе переданных параметров.

Пример

Попробуйте следующий пример.

JavaScript - Массивы. Метод splice var arr = ["orange", "melon", "milk", "sugar", "coffee"]; var removed = arr.splice(2, 0, "water"); document.write("После добавления 1: " + arr); document.write("
удален: " + removed); removed = arr.splice(3, 1); document.write("
После добавления 1: " + arr); document.write("
удален: " + removed);

Вывод После добавления 1: orange,melon,water,milk,sugar,coffee удален: После добавления 1: orange,melon,water,sugar,coffee удален: milk