JavaScript Array Remove an Element

Following is an example of JavaScript where we will remove elements from an array with Index and Value. There are different methods in JavaScript that we can use to remove elements. We will use splice() method.

Remove Array element by Index

First we will see an example were we will remove array element by its index. For this we can define a generic function removeByIndex().

function removeByIndex(arr, index) {
	arr.splice(index, 1);
}

In above code we used javascript splice() method to remove element at an index. splice() method takes two argument. First is the index at which you want to remove element and second is number of elements to be removed. In our case it is 1.
javascript-array-remove-element
To test the above code lets define a simple array and remove one of the element.

test = new Array();
test[0] = 'Apple';
test[1] = 'Ball';
test[2] = 'Cat';
test[3] = 'Dog';
alert("Array before removing elements: "+test);
removeByIndex(test, 2);
alert("Array after removing elements: "+test);

Also you may want to define removeByIndex method with an array so that you call it directly. For example, in following example, we have define an array test and its method removeByIndex().

test = new Array();
//define removeByIndex method as part of the array 
Array.prototype.removeByIndex = function(index) {
	this.splice(index, 1);
}
test[0] = 'Apple';
test[1] = 'Ball';
test[2] = 'Cat';
test[3] = 'Dog';
alert("Array before removing elements: "+test);
test.removeByIndex(2);
alert("Array after removing elements: "+test);

Remove Array element by Value

You may want to remove array element by its value and not index. This can be easily done by iterating through it and comparing the values, if a match is found we can remove that element by splice() method.

function removeByValue(arr, val) {
	for(var i=0; i<arr.length; i++) {
		if(arr[i] == val) {
			arr.splice(i, 1);
			break;
		}
	}
}

The above code can be written as part of array also:

test = new Array();
Array.prototype.removeByValue = function(val) {
	for(var i=0; i<this.length; i++) {
		if(this[i] == val) {
			this.splice(i, 1);
			break;
		}
	}
}
test[0] = 'Apple';
test[1] = 'Ball';
test[2] = 'Cat';
test[3] = 'Dog';
alert("Array before removing elements: "+test);
test.removeByValue('Cat');
alert("Array after removing elements: "+test);

Enjoy…



9 Comments

  • JavascriptBank.com 28 January, 2010, 7:24

    very cool & good tip, thank you very much for sharing.

    Can I share this post on my JavaScript library?

    Awaiting your response. Thank

  • omarxp 6 January, 2012, 14:50

    thanks, very helpful, this is what I was looking for.

  • steve 11 January, 2012, 14:40

    Spot on – thanks

  • Maria 27 January, 2012, 23:49

    Usually, I don’t leave comments, but I have to say this was exactly what I was looking for and it’s very well explained. Thank you VERY much!

  • Adrian - Alquiler Mina Clavero 29 May, 2012, 19:32

    Thanks very much for the script, i was looking for this to use in my site. removeByValue make my day…

  • Nikunj 25 January, 2013, 11:17

    Thanks Viral, Good explanation

  • Subbulakshmi 24 May, 2013, 18:38

    Thanks a lot for a wonderful explanation

  • Jaimin 23 February, 2014, 23:20

    It will only remove first occurrence!

Leave a Reply

Your email address will not be published. Required fields are marked *

Note

To post source code in comment, use [code language] [/code] tag, for example:

  • [code java] Java source code here [/code]
  • [code html] HTML here [/code]

Current day month ye@r *