JavaScript Array delete()

In this post, we will discuss delete() method available in JavaScript Array.

delete()

The delete() method will remove element from the array. It will take index position of the element and remove it. Index starts from 0.

Syntax:

delete array_name[index]

Here, the 'array_name' is the name if the array.

Example 1:-

Let us create an array that hold 10 strings and remove element present at index-2.

CopiedCopy Code
<html>
<body>
<script>
// Consider the array with 10 strings
const subjects =["php","html","node.js","java","jsp","html","sql","hadoop","iot","python"];
document.writeln("Actual data: <br>");
document.writeln(subjects);
// Use delete to remove the element present at index-2
delete subjects[2];
document.writeln("<br>");
document.writeln("<br>");
document.writeln("After removing the 3rd element: <br>");
document.writeln(subjects);
</script>
</body>
</html>

Output:

Actual data:
php,html,node.js,java,jsp,html,sql,hadoop,iot,python
After removing the 3rd element:
php,html,,java,jsp,html,sql,hadoop,iot,python

So, we can see that third element is removed from the array.

Example 2:-

Let us create an array that hold 5 strings and remove element present at index-2 and 4.

CopiedCopy Code
<html>
<body>
<script>
// Consider the array with 5 strings
const subjects =["php","html","node.js","java","jsp"];
document.writeln("Actual data: <br>");
document.writeln(subjects);
// Use delete to remove the element present at index-2
delete subjects[2];
document.writeln("<br>");
document.writeln("<br>");
document.writeln("After removing the 3rd element: <br>");
document.writeln(subjects);
// Use delete to remove the element present at index-4
delete subjects[4];
document.writeln("<br>");
document.writeln("<br>");
document.writeln("After removing the 5th element: <br>");
document.writeln(subjects);
</script>
</body>
</html>

Output:

Actual data:
php,html,node.js,java,jsp
After removing the 3rd element:
php,html,,java,jsp
After removing the 5th element:
php,html,,java,

So, we can see that third element is removed from the array and also fifth element is removed from the array.

Example 3:-

Let us create an array that hold 5 strings and remove element present at index-3 using button-onclick().

CopiedCopy Code
<html>
<body>
	<button onclick="click1()">Click to delete 4th element</button>
	<p id="subjects1"></p>
<script>
	var subjects = ["php","html","node.js","java","jsp"];
	document.getElementById("subjects1").innerHTML = subjects;
	function click1(){
		delete subjects[3]
		document.getElementById("subjects1").innerHTML = subjects;
		}
    </script>	
</body>
</html>

Output:

If we click the button, 4th element will be removed.

Example 4:-

Let us create an array that hold 5 strings and remove element present at index-0 using button-onclick().

CopiedCopy Code
<html>
<body>
	<button onclick="click1()">Click to delete 1st element</button>
	<p id="subjects1"></p>
<script>
	var subjects = ["php","html","node.js","java","jsp"];
	document.getElementById("subjects1").innerHTML = subjects;
	function click1(){
		delete subjects[0]
		document.getElementById("subjects1").innerHTML = subjects;
		}
    </script>	
</body>
</html>

Output:

,html,node.js,java,jsp

If we click the button, 1st (index=0) element will be removed.