Removing items from a javascript array while looping over it

Question

I have two JavaScript array's. For every item in first array, I need to check if that items exists in second array and if does, I should remove that item from second array. I do not want to create another array. At the end of the process I should have second array with the correct values. With below code I am not able to get the desired result.

var arr = [1, 2, 3];

var childArr = [1, 2, 3, 4, 51, 2, 3, 5];

for (var i = 0; i < arr.length; i++) {
    for (var j = 0; j < childArr.length; j++) {
        if (childArr[j] === arr[i]) {
            childArr.splice(childArr[j], 1);
        }
    }
}

Why don't you want to create another array? That would be much easier. var difference = childArr.filter(function(e) { return arr.indexOf(e) === -1; }); — JLRishe
– JLRishe, Commented May 9, 2014 at 13:47
The length of childArr will be decreased by one when you splice it, right? So you should do to j what? — Teemu
– Teemu, Commented May 9, 2014 at 13:48
Underscore difference or without are designed specifically for this. If underscore is available to you! — Josiah Hester
– Josiah Hester, Commented May 9, 2014 at 13:48
@JLRishe: I know I can do it with another array. Just wanted to check if there is a way without another array. — SharpCoder
– SharpCoder, Commented May 9, 2014 at 13:49

VisioN · Accepted Answer · 2014-05-09 13:50:16Z

4

You are trying to create an implementation of "array difference" algorithm, which could be easily rewritten with Array.prototype.filter method:

[1, 2, 3, 4, 51, 2, 3, 5].filter(function(c) {
    return [1, 2, 3].indexOf(c) < 0;
}); // [4, 51, 5]

answered May 9, 2014 at 13:50

VisioN

146k35 gold badges287 silver badges291 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

SharpCoder Over a year ago

Thank you for reply. using indexOf is not a good option as I need to support IE 8. I forgot to mention that in my question.

VisioN Over a year ago

@Brown_Dynamite For both filter and indexOf methods there are polyfills, that you may apply to support old browsers. Or if you use jQuery use $.grep and $.inArray methods correspondingly.

JLRishe Over a year ago

This doesn't meet OP's stated requirement of modifying the original array and not creating a new array. I already demonstrated pretty much this same approach in the comments 3 minutes before you posted this answer.

VisioN Over a year ago

@JLRishe Oh, it is good that you also know about it, nothing unique in this approach really. I was thoroughly waiting until someone posts it as an answer. Personally I don't see any requirements about that in the question: the OP's comment states that he knows how to do it with another array, which mostly refers to smth like arr = []; for ... if (...) arr.push(...);. However, this solution was not good for the OP because of compatibility issues (which obviously can be bypassed). And don't forget that the OP may be wrong with his concerns about new arrays: there is nothing bad in it.

JLRishe Over a year ago

The question text says "I should remove that item from second array. I do not want to create another array." (emphasis added) OP may indeed be mistaken with his/her concerns about new arrays, but s/he already knows how to accomplish this by creating a new array and that's not what the question was about.

|

RobG · Accepted Answer · 2014-05-09 13:59:07Z

0

Your issue is because when you splice a member from the array, it's length is shorter and the members are moved one lower, so you skip the next member. The simple solution is to iterate over the array being spliced in reverse.

Also, you need to splice j, not childArr[j].

var arr = [1, 2, 3];

var childArr = [1, 2, 3, 4, 51, 2, 3, 5];

for (var i = 0; i < arr.length; i++) {
    for (var j = childArr.length; j >=0; j--) {
        if (childArr[j] === arr[i]) {
            childArr.splice(j, 1);
        }
    }
}

console.log(childArr); // [4, 51, 5]

A while loop can also be used:

for (var i = 0; i < arr.length; i++) {
    var j = childArr.length;
    while (j--) {
        if (childArr[j] === arr[i]) {
            childArr.splice(j, 1);
        }
    }
}

edited May 9, 2014 at 13:59

answered May 9, 2014 at 13:52

RobG

148k32 gold badges180 silver badges216 bronze badges

Comments

jharig23 · Accepted Answer · 2014-05-09 14:25:52Z

0

How about this one? It's a little lengthy, but it handles the case where you have multiple occurrences of the values to remove. It also doesn't use indexOf.

var arr = [1, 2, 3];

var childArr = [1, 2, 3, 4, 51, 2, 3, 5];


for (var i = 0; i < arr.length;) {
    var foundInChildIndex = null;
    for (var j = 0; j < childArr.length; j++) {
        if (childArr[j] === arr[i]) {
            foundInChildIndex = j;
            break;
        }
    }
    if (foundInChildIndex != null) {
        childArr.splice(foundInChildIndex, 1);
    } else {
        i++;
    }
}

answered May 9, 2014 at 14:25

jharig23

1891 silver badge9 bronze badges

Comments

Dhrubajyoti Gogoi · Accepted Answer · 2014-05-09 14:25:55Z

0

You have got a small typo:

var arr = [1, 2, 3];
var childArr = [1, 1, 2, 3, 4, 51, 2, 3, 5];
for (var i = 0; i < arr.length; i++) {
   for (var j = 0; j < childArr.length; j++) {
       if (childArr[j] === arr[i]) {
           childArr.splice(j--, 1); // <-- pass index only.
       }
   }
}

edited May 9, 2014 at 14:25

answered May 9, 2014 at 13:58

Dhrubajyoti Gogoi

1,34010 silver badges20 bronze badges

4 Comments

RobG Over a year ago

If there are repeated values in childArr to be removed, the above will skip some and leave them in the array. Try childArr = [1, 1, 2, 5].

Dhrubajyoti Gogoi Over a year ago

@RobG It should right? Values of arr are compare to the full set of values in childArr. It is not doing a break. Although suitable answers have been provided, your comment has put in my interest. Have I missed something?

RobG Over a year ago

Yes, you missed something. In [1,1,2,5], when the value at index 0 is spliced, the member at index 1 is moved to index 0, index 2 to 1, and so on. The next member visited is at index 1 and has value 2, so the value 1 moved to index 0 remains when it should be removed.

Dhrubajyoti Gogoi Over a year ago

@RobG Got it. Edited my answer. That's what iterators are for in other languages.

Collectives™ on Stack Overflow

Removing items from a javascript array while looping over it

4 Answers 4

6 Comments

Comments

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

6 Comments

Comments

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related