Drag and drop selected array items in Javascript I've written a function that moves selected items from a list into a new position. I've found that in order to do this, I need to retain the original 'index structure' of the array. The way I've done this is, instead of splicing the array right away, I set the elements to null, then later traverse the list backwards and splice the null elements. I don't know if this is the best way of doing this, but I thought I would post it here to see if anyone else has an idea of how to better accomplish this.

https://jsfiddle.net/g407pjbk/1/

function drag_and_drop(list, before_index){
    const selected = [];

    for(let index in list){
        const item = list[index];

        if(item.selected){
            selected.push(item);

            // Set elements to null in order to retain indecies
            list[index] = null;
        }
    }

    // Insert selected items
    list.splice(before_index, 0, ...selected);

    // Backwards traverse and splice remaining null elements
    for(let i=list.length-1;i&gt;=0;i--){
        if(list[i] == null)
            list.splice(i, 1);
    }

    return list;
}
So you don't need two loops here. You can just use one loop to 


First, get the selected items
Remove the selected items from the actual array. So you can later put them in the index you want.


So to do that, first, you have to retrieve the indices where the selected obj is there. Then spice it. IN the loop

for (let index in list) {
    const item = list[index];

    if (item.selected) {
        selected.push(item);
        list.spice(index,1)
    }
}



So you don't have to run another loop to remove the null values. You can now simply just put the values using another spice. That saves you a loop.

You shouldn't be using for ... in for the reasons you have got in RoToRa's answer.

My approach: I prefer using just one filter. In that, you can do the same thing.

function drag_and_drop(list, before_index) {
  const selected = list.filter((obj,i) =&gt; obj.selected ? list.splice(i,1) : obj.selected)
  list.splice(before_index - selected.length , 0, ...selected)
  return list
}


So here, first we check if the object is selected and if it is then we'll just splice it off and if we didn't got a selected item then we can just return the selected item in the selected loop.

So now you have inside selected, the values which have item.selected as true and your list don't have them now because you did splice already in the filter, so you can just splice them with another splice. 

Now the index is not anymore before_index it's two values more, because we took out two objects. So to balance that, we will do before_index - selected.length because that's the number of indexes we are going to drop.