removing array javascript value sequentially from first index

Question

I have this array :

let items = ["apple", "orange", "watermelon", "blueberry", "lemon", "guava"];

and I want to remove array value sequentially from first index. so it will produce:

[ "apple", "orange", "watermelon", "blueberry", "lemon", "guava" ]
[ "orange", "watermelon", "blueberry", "lemon", "guava" ]
[ "watermelon", "blueberry", "lemon", "guava" ]
[ "blueberry", "lemon", "guava" ]
[ "lemon", "guava" ]
[ "guava" ]

I've already tried this code:

let items = ["apple", "orange", "watermelon", "blueberry", "lemon",   "guava"];

runLoop = async () => {
for(const item of items){
        await new Promise( resolve => setTimeout( resolve, 1000 ));
        console.log(items);
        remove(items, item);
        console.log('------------');
    }
 }

 function remove(array, element) {
  console.log('deleting '+element);
  const index = array.indexOf(element);
  array.splice(index, 1);
 }

but the result it's not what I expected, here is the result:

Array(6) [ "apple", "orange", "watermelon", "blueberry", "lemon", "guava" ]
Array(5) [ "orange", "watermelon", "blueberry", "lemon", "guava" ]
Array(4) [ "orange", "blueberry", "lemon", "guava" ]

Why getting the index when it always removes the first element? Just use array.splice(0,1). — MauriceNino
– MauriceNino, Commented Apr 11, 2019 at 9:19

CertainPerformance · Accepted Answer · 2019-04-11 10:24:13Z

3

The problem is that array iterable is live - if you invoke the iterator with for..of and mutate the array while that iterator is still being used, the resulting items iterated over will likely be unintuitive - some indicies may be missed. It's kind of like what's going on here:

let items = ["apple", "orange", "watermelon", "blueberry", "lemon",   "guava"];
for (let i = 0; i < items.length; i++) {
  console.log('item: ', items[i]);
  items.splice(i, 1);
}

The loop only runs 3 times, because you're removing items from the array while you're iterating over it, so some indicies get skipped.

One possibility is to make a copy of the array first, when invoking the iterator with for..of, so that the iterator will always iterate over every item that was in the original array sequentially:

let items = ["apple", "orange", "watermelon", "blueberry", "lemon",   "guava"];

runLoop = async () => {
  for(const item of items.slice()){
    await new Promise( resolve => setTimeout( resolve, 300 ));
    console.log(items);
    remove(items, item);
    console.log('------------');
  }
}

function remove(array, element) {
  console.log('deleting '+element);
  const index = array.indexOf(element);
  array.splice(index, 1);
}
runLoop();

edited Apr 11, 2019 at 10:24

answered Apr 11, 2019 at 9:22

CertainPerformance

373k55 gold badges354 silver badges359 bronze badges

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

1 Comment

MauriceNino Over a year ago

Explains it really well!

Nina Scholz · Accepted Answer · 2019-04-11 09:18:25Z

1

You need to splice at index zero,

array.splice(0, 1);

or just shift the first element.

array.shift();

answered Apr 11, 2019 at 9:18

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Comments

brk · Accepted Answer · 2019-04-11 09:24:59Z

0

An alternative can a recursive function and shift which removes the first element from an array

let items = ["apple", "orange", "watermelon", "blueberry", "lemon", "guava"];

function removeElem(arr) {
  if (arr.length !== 1) {
    console.log(arr)
    arr.shift();

    removeElem(arr)
  } else {
    console.log(arr)
  }
}
removeElem(items)

answered Apr 11, 2019 at 9:24

brk

50.3k10 gold badges59 silver badges85 bronze badges

Comments

Samudra Deka · Accepted Answer · 2019-04-11 09:40:48Z

0

You can use Array.slice to achieve this. When using splice, remember that it will affect the original array, which should not be done according to the functional approach of javascript. Functional programming doesn't recommend to mutate the original object.

let items = ["apple", "orange", "watermelon", "blueberry", "lemon", "guava"];

for(let i=0;i<items.length;i++){
   	console.log(items.slice(i,items.length));
 }

answered Apr 11, 2019 at 9:40

Samudra Deka

1011 silver badge9 bronze badges

Collectives™ on Stack Overflow

removing array javascript value sequentially from first index

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related