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 removedRemove 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 removedRemove 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.5Notes 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.Inserts, removes, or replaces elements in an array.
Specification: ECMAScript 3rd Edition.Syntax
Array.splice (start, deleteCount, element1, element2, ..., elementN)
Options
start The index of the array element from which the elements will be removed from the array and / or added to the array. Negative values are allowed, in this case the index from which the method will be called will be calculated using the following formula: length (length of the array) + start. deleteCount Optional value. An integer specifying the number of elements to remove from the array, starting at the index specified in start. If deleteCount is 0 then the items are not removed. If the deleteCount value is greater than the number of remaining elements in the array, then all elements to the end of the array will be deleted. Negative values are not allowed. elementN Optional value. Items to add to the array. If you don't specify any element, splice () will simply remove the elements from the array.Return value
A new array containing the removed elements (if any). If only one element is removed, an array of one element will be returned. If no elements are removed, an empty array will be returned.
Description
Method splice () removes the specified number of elements from the array, starting at the element positioned by start, including it, and replaces with the values listed in the argument list (element1, ..., elementN). The elements of the array that are located after the inserted or removed elements are shifted and form a contiguous sequence with the rest of the array.
On a note: Unlike the similarly named slice () method, the splice () method directly modifies the array.
Examples of
Method splice () removes 0 items by index 2 and inserts "Lemon":
one item by index 3 :
In the following example, the splice () method removes one item by index 2 and inserts "Kiwi".
The splice () method in Javascript arrays modifies the contents of the array, adding new elements, removing old ones.Syntax
Its syntax is as follows:
Array.splice (index, howMany, [, ..., elementN]);
Parameter details
- index - The index at which to start modifying the array.
- howMany - An integer indicating the number of old array elements to remove. If howMany is 0, no items are removed.
- element1,…, elementN - The elements to add to the array. If you don't specify any elements, splice simply removes the elements from the array.
Return value
Returns the retrieved array based on the passed parameters.
Example
Try the following example.
Output
After adding 1: orange, melon, water, milk, sugar, coffee removed: After adding 1: orange, melon, water, sugar, coffee removed: milkIn JavaScript, as well as in other programming languages, different methods are used to work with arrays.
Methods make it easy to build logic and implement it in a script.
Following are the basic methods for working with arrays in JS.
push
The push () method adds a value to the end of the array.
Let arr =; arr.push (312); console.log (arr); // →
pop
The pop () method removes the last element from the array or returns its value.
Let arr =; arr.pop (); console.log (arr); // →
Using the ability to get the value of the last element of the array, as an example, we can get the image format:
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
The unshift () method adds an element to the beginning of the array.
Let arr =; arr.unshift (312); console.log (arr); // →
shift
The shift () method removes the first element from the array.
Let arr =; arr.shift (); console.log (arr); // →;
You need to understand that when using the shift and unshift methods, each element of the array changes its index. This can slow down program execution if the array is long.
split
The split () method is used to transform a string into an array. Split splits a string by the specified parameter.
Let str = "Anya, Masha, Sasha, Dasha"; // this is a string let arr = str.split (","); console.log (arr); // → ["Anya", "Masha", "Sasha", "Dasha"] is an array
join
The join () method concatenates the elements of an array into a string, separated by the delimiter specified in the parameter.
Let arr = ["Notpad ++", "Sublime", "VSCode"]; // this is an array let str = arr.join (","); console.log ("Editors for the code:" + str); // → "Editors for code: Notpad ++, Sublime, VSCode"
slice
The slice () method creates a new array into which it copies elements from the source starting from the element with the index of the first parameter passed to the method, up to the element with the index of the second parameter.
For example: slice (3, 7) will return elements with indices 3, 4, 5, 6. The element with index 7 will not be included in the array.
If a parameter with a negative value is passed to slice (), then it returns a new array with the number of elements specified in the parameter, but already taken from the end of the original array.
The slice method does not modify the original array.
Here are some examples of how the slice () method works:
Let arr = ["A", "B", "C", "D", "E", "F", "G"]; // Returns an array containing elements with indices from 2 to 5 console.log (arr.slice (2, 5)); // → ["C", "D", "E"] // Returns a new array containing elements with indices from 3 to arr.length console.log (arr.slice (3)); // → ["D", "E", "F", "G"] // Returns a copy of the original array console.log (arr.slice ()); // → ["A", "B", "C", "D", "E", "F", "G"] // Returns a new array consisting of the last three elements of the original console.log (arr.slice (-3)); // → ["E", "F", "G"]
splice
The splice () method modifies the contents of the array by removing existing elements and / or adding new ones.
Syntax:
Array.splice (start, deleteCount [, item1 [, item2 [, ...]]])
Options:
- start- The index at which to start modifying the array. If greater than the length of the array, the real index will be set to the length of the array. If negative, specifies the index of the element from the end.
- deleteCount- An integer indicating the number of old elements removed from the array. If deleteCount is 0, no items are deleted. In this case, you must specify at least one new item. If deleteCount is greater than the number of elements remaining in the array, starting at index start, then all elements up to the end of the array will be deleted.
- itemN- Optional parameters. Items to add to the array. If you don't specify any element, splice () will simply remove the elements from the array.
Return value
Description
If the number of elements to be inserted is different from the number of elements to be removed, the array will change length after being called.
Let arr = [Barca, Shakhtar, Manchester United, Milan, Real Madrid, Ajax, Juventus]; let nax = arr.splice (2, 3); arr.splice (2, 3); console.log (nax); // → [Manchester United, Milan, Real Madrid] console.log (arr); // → [Barca, Miner] arr.splice (1, 0, Zenit, CSKA, Spartak); console.log (arr); // → [Barca, Zenit, CSKA, Spartak, Shakhtar]
reverse
The reverse () method reverses the order of the array elements. As a result, the first element of the array becomes the last, and the last element is the first.
Let arr =; console.log (arr.reverce ()); // → console.log (["Alice", "BG", "GO", "DDT"]. Reverce ()); // → ["DDT", "GO", "BG", "Alice"]
map
The map () method iterates over the elements of the array performing the specified actions with them and returns a copy of the array with the changed elements.
In the example below, to each element of the array, add the value of the index of this element (7 + 0, 2 + 1, 15 + 2, 4 + 3, 31 + 4):
Let arr =; let testMap = arr.map ((element, index) => element + index); console.log (testMap); //
or we multiply each value of the array, for example, by 12
Let arr =; let testMap = arr.map (a => a * 12); console.log (testMap); // →
filter
The filter () method is used to filter arrays. It walks through the array, returning only those elements that meet the specified condition.
For example, filter the values of the array from the numbers, leaving only those that are greater than 21
Let arr =; let testFilter = arr.filter (element => element> 21); console.log (testFilter); // →
Please note that 21 was not included in the result of the array, since the condition was to return something that is greater than 21. In order for 21 to enter the array, we set the condition as greater than or equal to: element> = 21
Definition and application
JavaScript method splice () allows you to change the contents of an array by removing existing elements, and / or adding new elements to the array.
Please note that the method splice () modifies an existing array rather than returning a new one. The removed items are returned as a new Array object.
Browser support
| Method | Opera | IExplorer | Edge |
|||
|---|---|---|---|---|---|---|
| splice () | Yes | Yes | Yes | Yes | Yes | Yes |
JavaScript syntax:
// only specifying the index array.splice ( start) // specifying the index and the number of removed elements array.splice ( start, deleteCount) // specifying the index, the number of removed elements and adding elements array.splice ( start, deleteCount, element1, element2, ..., elementX)JavaScript version
ECMAScript 3 (Implemented in JavaScript 1.2)Parameter values
| Parameter | Description |
|---|---|
| start | An integer specifying the index of the array from which elements will be removed from the array and / or added to the array. Negative values are allowed, in this case, the index from which the method will be called will be calculated using the following formula: length (length of the array) + start . Required. |
| deleteCount | An integer specifying the number of elements to remove from the array, starting with the index specified in start... If deleteCount equals 0, then the elements are not removed. If the value deleteCount more than the number of remaining elements in the array, then all the remaining elements of the array will be removed. Optional value, negative values are not allowed. |
| element (-s) | The element, or elements to be added to the array. The index of the array at which new elements will be inserted corresponds to the parameter start. Optional value. |
