8/19/2019 JavaScript Array.splice() vs Array.

slice() | TO THE NEW Blog

JavaScript : Array.splice() vs Array.slice()

18 / FEB / 2015 BY VIVEK GARG 10 COMMENTS

Share this blog

Email Twitter Facebook LinkedIn

1. The splice() method returns the removed item(s) in an array and slice() method returns the selected
element(s) in an array, as a new array object.

2. The splice() method changes the original array and slice() method doesn’t change the original array.

3. The splice() method can take n number of arguments:

Argument 1: Index, Required. An integer that specifies at what position to add /remove items, Use
negative values to specify the position from the end of the array.

Argument 2: Optional. The number of items to be removed. If set to 0(zero), no items will be
removed. And if not passed, all item(s) from provided index will be removed.

Argument 3…n: Optional. The new item(s) to be added to the array.

www.tothenew.com/blog/javascript-splice-vs-slice/ 1/5
8/19/2019 JavaScript Array.splice() vs Array.slice() | TO THE NEW Blog

1 var array=[1,2,3,4,5];
2 console.log(array.splice(2));
3 // shows [3, 4, 5], returned removed item(s) as a new array
4 object.
5
6
7 console.log(array);
8 // shows [1, 2], original array altered.
9
10 var array2=[6,7,8,9,0];
11 console.log(array2.splice(2,1));
12 // shows [8]
13
14
15 console.log(array2.splice(2,0));
16 //shows [] , as no item(s) removed.
17
18 console.log(array2);
19 // shows [6,7,9,0]
20
21 var array3=[11,12,13,14,15];
22
23
console.log(array3.splice(2,1,"Hello","World"));
24 // shows [13]
25
26 console.log(array3);
27 // shows [11, 12, "Hello", "World", 14, 15]
28
29 -5 -4 -3 -2 -1
30
31
| | | | |
32 var array4=[16,17,18,19,20];
33 | | | | |
34 0 1 2 3 4
35
console.log(array4.splice(-2,1,"me"));
// shows [19]

console.log(array4);
// shows [16, 17, 18, "me", 20]

If Argument(1) is NaN, it is treated as if it were 0.

1 var array5=[21,22,23,24,25];
2 console.log(array5.splice(NaN,4,"NaN is Treated as 0"));
3 // shows [21,22,23,24]
4
5
6 console.log(array5);
// shows ["NaN is Treated as 0",25]

If Argument(2) is less than 0 or equal to NaN, it is treated as if it were 0.

www.tothenew.com/blog/javascript-splice-vs-slice/ 2/5
8/19/2019 JavaScript Array.splice() vs Array.slice() | TO THE NEW Blog

1 var array6=[26,27,28,29,30];
2 console.log(array6.splice(2,-5,"Hello"));
3 // shows []
4
5
6
console.log(array6);
7 // shows [26,27,"Hello",28,29,30]
8
9 console.log(array6.splice(3,NaN,"World"));
10 // shows []
11
12 console.log(array6);
// shows [26,27,"Hello","World",28,29,30]

If Argument(1) or Argument(2) is greater than Array’s length, either argument will use the
Array’s length.

1 var array7=[31,32,33,34,35];
2 console.log(array7.splice(23,3,"Add Me"));
3 // shows []
4
5
6 console.log(array7);
7 // shows [31,32,33,34,35,"Add Me"]
8
9 console.log(array7.splice(2,34,"Add Me Too"));
10 // shows [33,34,35,"Add Me"]
11
12 console.log(array7);
// shows [31,32,"Add Me Too"]

4. The slice() method can take 2 arguments:

Argument 1: Required. An integer that specifies where to start the selection (The first element has an
index of 0). Use negative numbers to select from the end of an array.

Argument 2: Optional. An integer that specifies where to end the selection. If omitted, all elements
from the start position and to the end of the array will be selected. Use negative numbers to select
from the end of an array.

www.tothenew.com/blog/javascript-splice-vs-slice/ 3/5
8/19/2019 JavaScript Array.splice() vs Array.slice() | TO THE NEW Blog

1 var array=[1,2,3,4,5]
2 console.log(array.slice(2));
3 // shows [3, 4, 5], returned selected element(s).
4
5
6
console.log(array.slice(-2));
7 // shows [4, 5], returned selected element(s).
8 console.log(array);
9 // shows [1, 2, 3, 4, 5], original array remains intact.
10
11 var array2=[6,7,8,9,0];
12 console.log(array2.slice(2,4));
13 // shows [8, 9]
14
15
16 console.log(array2.slice(-2,4));
17 // shows [9]
18
19 console.log(array2.slice(-3,-1));
20 // shows [8, 9]
21
console.log(array2);
// shows [6, 7, 8, 9, 0]

If either argument is NaN, it is treated as if it were 0.

1 var array3=[11,12,13,14,15];
2 console.log(array3.slice(NaN,NaN));
3 // shows []
4
5
6
console.log(array3.slice(NaN,4));
7 // shows [11,12,13,14]
8
9 console.log(array3);
// shows [11,12,13,14,15]

If either argument is greater than the Array’s length, either argument will use the Array’s
length

1 var array4=[16,17,18,19,20];
2 console.log(array4.slice(23,24));
3 // shows []
4
5
6
console.log(array4.slice(23,2));
7 // shows []
8
9 console.log(array4.slice(2,23));
10 // shows [18,19,20]
11
12 console.log(array4);
// shows [16,17,18,19,20]

www.tothenew.com/blog/javascript-splice-vs-slice/ 4/5