What is the difference between splice and slice in javascript?

The slice( ) method copies a given part of an array and returns that copied part as a new array. It doesn’t change the original array.

The splice( ) method changes an array, by adding or removing elements from it.

Here is the slice syntax:

array.slice(from, until);

// example
let array = [1, 2, 3, 4, 5, 6]
let newArray = array.slice(1, 3)
console.log({array, newArray})

// output: array: [1, 2, 3, 4, 5, 6], newArray: [2, 3]

Note: the Slice( ) method can also be used for strings.

And here is the splice syntax:

//For removing elements, we need to give the index parameter,
// and the number of elements to be removed

array.splice(index, number of elements to be removed);


//example
let array = [1, 2, 3, 4, 5, 6]
let newArray = array.splice(1, 3)
console.log({array, newArray})

// output: array: [1, 5, 6], newArray: [2, 3, 4]

Note: If we don’t define the second parameter, every element starting from the given index will be removed from the array

// For adding elements, we need to give them as the 3rd, 4th, ... parameter
array.splice(index, number of elements to be removed, element, element);

//example
let array = [1, 2, 3, 4, 5, 6]
let newArray = array.splice(1, 3, 'a', 'b')
console.log({array, newArray})

// output: array: [1, ,'a', 'b', 5, 6], newArray: [2, 3, 4]

Related links:

Let’s clear up the confusion around the slice( ), splice( ), & split( ) methods in JavaScript

Array.prototype.slice()

Array.prototype.splice()

Javascript arrays are variables that can hold more than one value. There are many methods associated with these arrays. The methods slice() and splice() are widely used methods for array manipulations. There are various differences between them which are listed in the table below.

Syntax:

• slice():

  array_name.slice(s, e)

• splice():

  array_name.splice(i, n, item 1, item 2, .....item n)

Examples for slice() method
Example 1: Both the start and end are specified.