Splice in JavaScript

Suprabha - Aug 23 '20 - - Dev Community

The splice method changes the content of the array in place and can be used to add or remove items from the array.

const arr = ["🌼", "🌴", "🌹", "🌡", "πŸ„"];
arr.splice(2,3); // ["🌹", "🌡", "πŸ„"]
console.log(myArr); // ["🌼", "🌴"]
Enter fullscreen mode Exit fullscreen mode

Syntax:

let arrDeletedItems = array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
Enter fullscreen mode Exit fullscreen mode

start specifies index at which to start changing the array.

If start is greater than the length of the array, then start will be set to the length of the array. i.e no element will be deleted.

If start is negative, it will begin that many elements from the end of the array.

In deleteCount, The number of items you want to remove.

In item, The number you want to add(If you're removing, you can just leave this blank).

NOTE: Splice always return an array containing the deleted elements.

🌚 When only one argument is provided, all the items after the provided starting index are removed from the array:

const arr = ["🌼", "🌴", "🌹", "🌡", "πŸ„"];
arr.splice(2); // ["🌹", "🌡", "πŸ„"]
console.log(myArr); // ["🌼", "🌴"]
Enter fullscreen mode Exit fullscreen mode

🌚 Remove 1 element at index 3:

const arr = ["🌼", "🌴", "🌹", "🌡", "πŸ„"];
arr.splice(3, 1); // ["🌡"]
console.log(myArr); // ["🌼", "🌴", "🌹", "πŸ„"]
Enter fullscreen mode Exit fullscreen mode

🌚 An arbitrary amount of additional arguments can be passed-in and will be added to the array:

const arr = ["🌼", "🌴", "🌹", "🌡", "πŸ„"];
arr.splice(2, 1, "⭐️", "πŸ’₯"); // ["🌹"]
console.log(myArr); // ["🌼", "🌴", "⭐️", "πŸ’₯", "🌡", "πŸ„"]
Enter fullscreen mode Exit fullscreen mode

🌚 Remove 1 element from index -2:

const arr = ["🌼", "🌴", "🌹", "🌡", "πŸ„"];
arr.splice(-2, 1); // ["🌡"]
console.log(myArr); // ["🌼", "🌴", "🌹", "πŸ„"]
Enter fullscreen mode Exit fullscreen mode

🌚 You can specify 0 as the number of items to remove to simply add new items at the specified location in the array:

const arr = ["🌼", "🌴", "🌹", "🌡", "πŸ„"];
arr.splice(2, 0, "⭐️", "πŸ’₯"); // []
console.log(myArr); // ["🌼", "🌴", "⭐️", "πŸ’₯", "🌹", "🌡", "πŸ„"]
Enter fullscreen mode Exit fullscreen mode

🌚 Add few items at the end of array:

const arr = ["🌼", "🌴", "🌹", "🌡", "πŸ„"];
arr.splice(arr.length, 0, "πŸŒ•", "🌞", "🌦"); // []
console.log(myArr); // ["🌼", "🌴", "🌹", "🌡", "πŸ„", "πŸŒ•", "🌞", "🌦"]
Enter fullscreen mode Exit fullscreen mode

Reference 🧐

Splice MDN

🌟 Twitter πŸ‘©πŸ»β€πŸ’» Suprabha.me 🌟 Instagram
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .