Hello dev today now in this post i will show you How to Work with JavaScript Array Splice Method? In JavaScript’s array splice method is very handy when it comes to add, remove, or replace items in an array. In this tutorial, I am going to discuss with you the main features of JavaScript’s Array splice() method.
JavaScript Array splice method features
- The splice() method allow us to add or remove elements from an array.
- The splice() method modifies the current array and returns a new array.
1. Splice Method’s Parameter Values Explained
Before we move further, let me explain the arguments passed into the splice method.
ArrayName.splice(start, how_many_items_to_remove, item1, item2, ...);
start
The index number is the required value, it specifies the position of an array from where the array starts changing. If passed negative value, then it will calculate the position from the end of the array.
how_many_items_to_remove
This parameter decides the total items to be deleted from the array. If this parameter is set to 0 or negative, then no elements will be removed from the array.
item1, item2, ...
This parameter defines the item in an array. This argument is not required.
2. How to Insert an Item in An array using JavaScript’s Array.splice() Method?
Let’s start with a very basic example of by adding an item in a cars array with the JavaScript’s Array splice() method.
// cars Array var carsArray1 = ['Tesla', 'Toyota', 'BMW']; var carsArray2 = ['Honda', 'Ford', 'Porsche', 'RR']; // Add 1 items at the starting of cars array // Show carsArray1 result in console // Answer will be [ 'Suzuki', 'Tesla', 'Toyota', 'BMW' ] carsArray1.splice(0,0, 'Suzuki'); console.log(carsArray1); // Add 2 items in cars array at 2nd and 3rd position // Show carsArray2 result in console // Answer will be [ 'Honda', 'Ford', 'Suzuki', 'Nissan', 'Porsche', 'RR' ] carsArray2.splice(2,0, 'Suzuki', 'Nissan') console.log(carsArray2);
3. How to Remove an Item in An array using Splice Method?
// cars Array var carsArray1 = ['Tesla', 'Toyota', 'BMW']; var carsArray2 = ['Honda', 'Ford', 'Porsche', 'RR']; // Remove 1 item from index 1 from carsArray1 // Removed item will be ['Toyota'] in carsArray1 // Returned items are [ 'Tesla', 'BMW' ] in carsArray1 carsArray1.splice(1,1) console.log(carsArray1) // Remove 2 item from index 1 from carsArray2 // Removed items will be ['Ford', 'Porsche'] in carsArray2 // Returned items are [ 'Honda', 'RR' ] in carsArray2 carsArray2.splice(1,2) console.log(carsArray2)
4. How to Replace an Item in An array using JavaScript’s splice() Method?
Finally, let’s get to know how to Replace some elements in an array in javascript with the splice() method.
// cars Array var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford']; // Lets replace BMW with Wagon cars.splice(2,1, 'Wagon'); // Check the result in browser's console // Result will be [ 'Tesla', 'Toyota', 'Wagon', 'Honda', 'Ford' ] console.log(cars);
Read Also: How to Create Password Show / Hide Toggle Button in React
Thanks for read. I hope it help you. For more you can follow us on facebook.
