How to properly delete object from array?

Question

I have a javascript function which delete object from object array:

function RemoveFilter(filtArray,filtName) {
    var filtCount = filtArray.length;

    ...
    ...

    for (var i = 0; i < filtCount; i++) {
        var filter = filtArray[i];
        if (filter != undefined && filter.name == filtName) {
            delete filtArray[i];
        }
    }

    ...
    ...
}

It's works but I got a big problem. Instead of removing object completelly, it leaves undefined on its place (that why I have filter != undefined in my if).

So basically, if I am adding something after removal, I have not only new values but also those undefiled, and array is growing.

Probably my choise of object removing is poor but, how can I deal with this problem? Considering that filtArray[i].remove not working at all.

[possible duplicate](http://stackoverflow.com/questions/500606/javascript-array-delete-elements) — lshettyl, Mar 23 '15 at 11:46
For such a task an elegant solution, if you're using jQuery, would be using the .filter prototype as an alternative to the splice method. Is your array an associative array? **Check georg's solution below!** — briosheje, Mar 23 '15 at 11:49

georg · Accepted Answer · 2015-03-23T12:15:52.620

3

Instead of trying to modify an array in place, which is messy and error prone, just create a new array using filter and assign it back to the original:

myArray = myArray.filter(function(item) {
    return item.name !== name
});

edited Mar 23 '15 at 12:15

answered Mar 23 '15 at 11:48

georg

211,518
52
313
390

Oh darn, just said that above in the comments. This is a much cleaner solution instead of a .splice and it also is way more versatile, due to the fact that you might **slightly** edit that filter in order to delete more items providing a regular object. Bump that solution! +1 – briosheje Mar 23 '15 at 11:50
Thank you! This was the best one. No questionable splice and also allows to throw to oblivion "for". – Olegs Jasjko Mar 23 '15 at 12:06

nikjohn · Answer 2 · 2015-03-23T11:57:28.890

2

You want to use splice() instead of delete. That should work.

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");

will give:

Banana,Orange,Lemon,Kiwi,Apple,Mango

If you don't want to add new elements while removing others, you might wanna do this;

fruits.splice(2, 1);

The result of fruits will be:

Banana,Orange,Lemon

Shamelessly copied from W3Schools

In your case,

function RemoveFilter(filtArray,filtName) {
    var filtCount = filtArray.length;
    for (var i = 0; i < filtCount; i++) {
        var filter = filtArray[i];
        if (filter != undefined && filter.name == filtName) {
            filtArray.splice(i,1);
        }
    }
}

This will remove the i-th object and not leave an undefined hanging there.

edited Mar 23 '15 at 11:57

answered Mar 23 '15 at 11:43

nikjohn

20,026
14
50
86

3

An example that actually uses splice to **remove** items rather than insert new ones might be more useful. – Anthony Grist Mar 23 '15 at 11:46
Em and how it supposed to help? As I see in your example, it add new values and not removes them (also - how to do this in array?). Also, doit it update original array or what? – Olegs Jasjko Mar 23 '15 at 11:47
@OlegsJasjko, check now. I've added your scenario – nikjohn Mar 23 '15 at 11:52
@Olegs Corrected a mistake with the splice statement. Check now. – nikjohn Mar 23 '15 at 11:57

Saad · Answer 3 · 2015-03-23T12:00:03.463

Using splice() is generally the way to go, and you can make it neat by doing something like this:

function removeFilter(filtArray, filtName) {
  var index = filtArray.indexOf(filtName);
  filtArray.splice(index, 1);
}

You can read more about splice() here.

EDIT:

To show you an example:

var dog = {name: 'Spot', type: 'Dog'}; 
var cat = {name: 'Meow', type: 'Cat'}; 
var animals = [dog, cat];

removeFilter(animals, dog); // -> Removes the dog object from the array

console.log(animals) // -> Only has the cat object remaining

How to properly delete object from array?

3 Answers3