Javascript Slice Vs Splice

#javascript #array

Javascript Slice vs Splice: Javascript provides some of the most interesting ways to operate on Arrays. Among those many ways, Array.slice() and Array.splice() method lies. But it is very common to get confused between slice and splice. And that is where this article is going to help you all.

Both of these methods i.e Array.slice() and Array.splice() have quite similar names but they act in very different ways. In this article, we are going to learn what is the difference between Javascript Slice and Splice and also how to use them in a proper way. So, without wasting more time let’s dive in.

Javascript Slice vs Splice

Table of Contents

What is Array.slice() in Javascript?

Array.slice() method is used to copy a given part of the array. It returns the copied array as a new array without changing the original array.

Here is the syntax of Array.slice() method

array.slice(from, until);

As we can see, Array.slice() method takes two arguments. The first arguments define the starting index i.e from where to start the selection (The first element has an index of 0). Use negative numbers to select from the end of an array and the second argument defines the ending index.

Here is a working example of Array.slice()

const array=[1,2,3,4,5]
console.log(array.slice(2));
// Output [3, 4, 5], returned selected element(s).

console.log(array.slice(-2));
// Output [4, 5], returned selected element(s).
console.log(array);
// shows [1, 2, 3, 4, 5], original array remains intact.

const array2=[6,7,8,9,0];
console.log(array2.slice(2,4));
// output [8, 9]

What is Array.splice() in Javascript?

The Array.splice( ) method changes the original array, by adding or removing elements from it and return the removed items in a new array.

Here is the syntax of Array.splice() method

array.splice(index, number of elements);

Array.splice() method also takes two arguments. The first argument i.e. Index is the starting point for removing elements. Elements that have a smaller index number from the given index won’t be removed.

Here is a working example of the same

array.splice(2);  // Every element starting from index 2, will be removed

The second arguments define the number of elements to be removed from the starting index. If you choose the starting index as two and the second argument value is four, then the elements starting from the index two and ending on the index four will be removed. Here is an example of Array.splice()

const array=[1,2,3,4,5];
console.log(array.splice(2));
// shows [3, 4, 5], returned removed item(s) as a new array object.

console.log(array);
// shows [1, 2], original array altered.

const array2=[6,7,8,9,0];
console.log(array2.splice(2,1));
// shows [8]

console.log(array2.splice(2,0));
//shows [] , as no item(s) removed.

So, this is all about the difference between Array.slice() and Array.splice() method in Javascript. Thanks for Reading!
If you want to read more articles like these, don't forget to visit my coding blog - Codingshala.com

Top comments (4)

Irfan Raza • Oct 13 '19

I agree that this is very confusing that while writing you also got confused while defining :
"What is Array.slice() in Javascript?
--> Here is the error - Array.splice() method is used