Replacing and Adding elements is one of the most important aspects of JavaScript. In this article, we will understand the Splice method() in Javascript in the following manner:
What is Splice Method() in JavaScript?
The splice() method in JavaScript changes the contents of an array by removing or replacing existing elements and/or adding new elements.
Syntax
array.splice(index, howMany, [element1][, ..., elementN]);
Array.splice( index, remove_count, item_list )
Parameters of Splice Method() in JavaScript
This method accepts many parameters some of them are described below:
index: It is a required parameter. This parameter is the index which starts modifying the array (with the origin at 0). This can be negative also, which begins after that many elements counting from the end.
remove_count: The number of elements to be removed from the starting index.
items_list: The list of new items separated by a comma operator that is to be inserted from the starting index.
Return Value: While it mutates the original array in-place, still it returns the list of removed items. In case there is no removed array it returns an empty array
Example Code
Example 1:
<!DOCTYPE html>
<html>
<body>
<p>Click the button to add and remove elements.</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits;
function myFunction() {
fruits.splice(2, 1, "Lemon", "Kiwi");
document.getElementById("demo").innerHTML = fruits;
}
</script>
</body>
</html>
Find out our UI UX Design Course in Top Cities
| India | India |
| UI UX Designer Course in Chennai | UI UX Design Course in Mumbai |
| UI UX Design Course in Pune | UI UX Design Course in Ahmedabad |
| UI UX Design Course in Bangalore | UI UX Design Course in Delhi |
Add an element to the existing array while removing other elements.
<script> var arr=["Monday","Tuesday","Saturday","Sunday","Thursday","Friday"]; var result=arr.splice(2,2,"Wednesday") document.writeln("Updated array: "+arr+"<br>"); document.writeln("Removed element: "+result); </script>
Example 3:
Add an element to the existing array while removing other elements.
<script> var arr=["Monday","Tuesday","Saturday","Sunday","Thursday","Friday"]; var result=arr.splice(2); document.writeln("Updated array: "+arr+"<br>"); document.writeln("Removed element: "+result); </script>
With this, we come to an end of this Splice method() in Javascript article. I hope you got an understanding of how to use the splice method().
Transform your designs and boost your career with our UI UX Design Course.
Check out the Web Development Certification Training by Edureka. Web Development Certification Training will help you learn how to create impressive websites using HTML5, CSS3, Twitter Bootstrap 3, jQuery and Google APIs and deploy it to Amazon Simple Storage Service(S3).
Check out the Angular Online Course by Edureka, a trusted online learning company with a network of more than 250,000 satisfied learners spread across the globe. Angular is a JavaScript framework that is used to create scalable, enterprise, and performance client-side web applications. With Angular framework adoption being high, performance management of the application is community-driven indirectly driving better job opportunities.
Got a question for us? Please mention it in the comments section of this article and we will get back to you.