How to remove element from array in forEach loop

Question

I am trying to remove an element in an array in a forEach loop, but am having trouble with the standard solutions I've seen.

This is what I'm currently trying:

review.forEach(function(p){
   if(p === '\u2022 \u2022 \u2022'){
      console.log('YippeeeE!!!!!!!!!!!!!!!!')
      review.splice(p, 1);
   }
});

I know it's getting into the if because I'm seeing YippeeeeeE!!!!!!!!!!!!! in the console.

MY PROBLEM: I know that my for loop and if logic are sound, but my attempt to remove the current element from the array is failing.

UPDATE:

Tried out Xotic750's answer, and the element is still not being removed:

Here is the function in my code:

review.forEach(function (item, index, object) {
    if (item === '\u2022 \u2022 \u2022') {
       console.log('YippeeeE!!!!!!!!!!!!!!!!')
       object.splice(index, 1);
    }
    console.log('[' + item + ']');
});

Here is the output where the array is still not removed:

[Scott McNeil]
[reviewed 4 months ago]
[ Mitsubishi is AMAZING!!!]
YippeeeE!!!!!!!!!!!!!!!!
[• • •]

So obviously it is going into the if statement as directed, but it's also obvious that the [• • •] is still there.

User · Answer

Although Xotic750 s answer provides several good points and possible solutions  sometimes simple is better   You know the array being iterated on is being mutated in the iteration itself  i e  removing an item    index changes   thus the simplest logic is to go backwards in an old fashioned for     la C language     x000D   x000D  let arr     a    a    b    c    b    a    a    x000D   x000D  for  let i   arr length - 1  i  gt   0  i--    x000D    if  arr i       a     x000D      arr splice i  1   x000D      x000D    x000D   x000D  document body append arr join     x000D   x000D   x000D    If you really think about it  a forEach is just syntactic sugar for a for loop    So if it s not helping you  just please stop breaking your head against it

User · Answer

It looks like you are trying to do this  Iterate and mutate an array using Array prototype splice  x000D   x000D  var pre   document getElementById  out     function log result      pre appendChild document createTextNode result     n        var review     a    b    c    b    a     review forEach function item  index  object      if  item      a         object splice index  1            log review   x000D   lt pre id  out  gt  lt  pre gt  x000D   x000D   x000D   Which works fine for simple case where you do not have 2 of the same values as adjacent array items  other wise you have this problem   x000D   x000D  var pre   document getElementById  out     function log result      pre appendChild document createTextNode result     n        var review     a    a    b    c    b    a    a     review forEach function item  index  object      if  item      a         object splice index  1            log review   x000D   lt pre id  out  gt  lt  pre gt  x000D   x000D   x000D   So what can we do about this problem when iterating and mutating an array  Well the usual solution is to work in reverse  Using ES3 while but you could use for sugar if preferred  x000D   x000D  var pre   document getElementById  out     function log result      pre appendChild document createTextNode result     n        var review     a    a    b    c    b    a    a      index   review length - 1   while  index  gt   0      if  review index       a         review splice index  1          index -  1     log review   x000D   lt pre id  out  gt  lt  pre gt  x000D   x000D   x000D   Ok  but you wanted to use ES5 iteration methods  Well and option would be to use Array prototype filter but this does not mutate the original array but creates a new one  so while you can get the correct answer it is not what you appear to have specified  We could also use ES5 Array prototype reduceRight  not for its reducing property by rather its iteration property  i e  iterate in reverse   x000D   x000D  var pre   document getElementById  out     function log result      pre appendChild document createTextNode result     n        var review     a    a    b    c    b    a    a     review reduceRight function acc  item  index  object      if  item      a         object splice index  1                log review   x000D   lt pre id  out  gt  lt  pre gt  x000D   x000D   x000D   Or we could use ES5 Array protoype indexOf like so   x000D   x000D  var pre   document getElementById  out     function log result      pre appendChild document createTextNode result     n        var review     a    a    b    c    b    a    a      index   review indexOf  a     while  index     -1      review splice index  1     index   review indexOf  a       log review   x000D   lt pre id  out  gt  lt  pre gt  x000D   x000D   x000D   But you specifically want to use ES5 Array prototype forEach  so what can we do  Well we need to use Array prototype slice to make a shallow copy of the array and Array prototype reverse so we can work in reverse to mutate the original array   x000D   x000D  var pre   document getElementById  out     function log result      pre appendChild document createTextNode result     n        var review     a    a    b    c    b    a    a     review slice   reverse   forEach function item  index  object      if  item      a         review splice object length - 1 - index  1            log review   x000D   lt pre id  out  gt  lt  pre gt  x000D   x000D   x000D   Finally ES6 offers us some further alternatives  where we do not need to make shallow copies and reverse them  Notably we can use Generators and Iterators  However support is fairly low at present   x000D   x000D  var pre   document getElementById  out     function log result      pre appendChild document createTextNode result     n        function  reverseKeys arr      var key   arr length - 1     while  key  gt   0        yield key      key -  1         var review     a    a    b    c    b    a    a     for  var index of reverseKeys review       if  review index       a         review splice index  1          log review   x000D   lt pre id  out  gt  lt  pre gt  x000D   x000D   x000D   Something to note in all of the above is that  if you were stripping NaN from the array then comparing with equals is not going to work because in Javascript NaN     NaN is false  But we are going to ignore that in the solutions as it it yet another unspecified edge case  So there we have it  a more complete answer with solutions that still have edge cases  The very first code example is still correct but as stated  it is not without issues

User · Answer

Use Array prototype filter instead of forEach   var pre   document getElementById  out     function log result      pre appendChild document createTextNode result     n        var review     a    b    c    b    a    e    review   review filter item   gt  item      a    log review

User · Answer

The following will give you all the elements which is not equal to your special characters     review   jQuery grep  review  function   value         return   value       u2022  u2022  u2022

User · Answer

I understood that you want to remove from the array using a condition and have another array that has items removed from the array. Is right?

How about this?

_x000D_

var review = ['a', 'b', 'c', 'ab', 'bc'];_x000D_
var filtered = [];_x000D_
for(var i=0; i < review.length;) {_x000D_
  if(review[i].charAt(0) == 'a') {_x000D_
    filtered.push(review.splice(i,1)[0]);_x000D_
  }else{_x000D_
    i++;_x000D_
  }_x000D_
}_x000D_
_x000D_
console.log("review", review);_x000D_
console.log("filtered", filtered);

_x000D_

Hope this help...

By the way, I compared 'for-loop' to 'forEach'.

If remove in case a string contains 'f', a result is different.

_x000D_

var review = ["of", "concat", "copyWithin", "entries", "every", "fill", "filter", "find", "findIndex", "flatMap", "flatten", "forEach", "includes", "indexOf", "join", "keys", "lastIndexOf", "map", "pop", "push", "reduce", "reduceRight", "reverse", "shift", "slice", "some", "sort", "splice", "toLocaleString", "toSource", "toString", "unshift", "values"];_x000D_
var filtered = [];_x000D_
for(var i=0; i < review.length;) {_x000D_
  if( review[i].includes('f')) {_x000D_
    filtered.push(review.splice(i,1)[0]);_x000D_
  }else {_x000D_
    i++;_x000D_
  }_x000D_
}_x000D_
console.log("review", review);_x000D_
console.log("filtered", filtered);_x000D_
/**_x000D_
 * review [  "concat",  "copyWithin",  "entries",  "every",  "includes",  "join",  "keys",  "map",  "pop",  "push",  "reduce",  "reduceRight",  "reverse",  "slice",  "some",  "sort",  "splice",  "toLocaleString",  "toSource",  "toString",  "values"] _x000D_
 */_x000D_
_x000D_
console.log("========================================================");_x000D_
review = ["of", "concat", "copyWithin", "entries", "every", "fill", "filter", "find", "findIndex", "flatMap", "flatten", "forEach", "includes", "indexOf", "join", "keys", "lastIndexOf", "map", "pop", "push", "reduce", "reduceRight", "reverse", "shift", "slice", "some", "sort", "splice", "toLocaleString", "toSource", "toString", "unshift", "values"];_x000D_
filtered = [];_x000D_
_x000D_
review.forEach(function(item,i, object) {_x000D_
  if( item.includes('f')) {_x000D_
    filtered.push(object.splice(i,1)[0]);_x000D_
  }_x000D_
});_x000D_
_x000D_
console.log("-----------------------------------------");_x000D_
console.log("review", review);_x000D_
console.log("filtered", filtered);_x000D_
_x000D_
/**_x000D_
 * review [  "concat",  "copyWithin",  "entries",  "every",  "filter",  "findIndex",  "flatten",  "includes",  "join",  "keys",  "map",  "pop",  "push",  "reduce",  "reduceRight",  "reverse",  "slice",  "some",  "sort",  "splice",  "toLocaleString",  "toSource",  "toString",  "values"]_x000D_
 */

_x000D_

And remove by each iteration, also a result is different.

_x000D_

var review = ["of", "concat", "copyWithin", "entries", "every", "fill", "filter", "find", "findIndex", "flatMap", "flatten", "forEach", "includes", "indexOf", "join", "keys", "lastIndexOf", "map", "pop", "push", "reduce", "reduceRight", "reverse", "shift", "slice", "some", "sort", "splice", "toLocaleString", "toSource", "toString", "unshift", "values"];_x000D_
var filtered = [];_x000D_
for(var i=0; i < review.length;) {_x000D_
  filtered.push(review.splice(i,1)[0]);_x000D_
}_x000D_
console.log("review", review);_x000D_
console.log("filtered", filtered);_x000D_
console.log("========================================================");_x000D_
review = ["of", "concat", "copyWithin", "entries", "every", "fill", "filter", "find", "findIndex", "flatMap", "flatten", "forEach", "includes", "indexOf", "join", "keys", "lastIndexOf", "map", "pop", "push", "reduce", "reduceRight", "reverse", "shift", "slice", "some", "sort", "splice", "toLocaleString", "toSource", "toString", "unshift", "values"];_x000D_
filtered = [];_x000D_
_x000D_
review.forEach(function(item,i, object) {_x000D_
  filtered.push(object.splice(i,1)[0]);_x000D_
});_x000D_
_x000D_
console.log("-----------------------------------------");_x000D_
console.log("review", review);_x000D_
console.log("filtered", filtered);

_x000D_

User · Answer

You could also use indexOf instead to do this  var i   review indexOf   u2022  u2022  u2022    if  i     -1  review splice i 1

User · Answer

Here is how you should do it   review forEach function p index object      if review index        u2022  u2022  u2022          console log  YippeeeE                         review splice index  1

[javascript] How to remove element from array in forEach loop?

The answer is

Examples related to javascript

Examples related to foreach

Tags