Do undefined elements in an array have an impact in JS?

Question

I couldn't find a question that specifically targets the issue I'm having hence this question is being asked.

I have an array that holds 5 numbers:

var numbers = [0,1,2,3,4];

Once a number is clicked on the frontend (website), the number is removed from the array using the below code:

delete numbers[1];

This removes the correct number but leaves a space where the number was (the space is undefined). I believe this is causing an issue. After a number is removed from the array, I use another function to randomly pick any of the remaining numbers in the array however it sometimes fails. After much thought, I've realized it may be because there are empty spaces in the array after a number is removed and as a result, the code fails to work due to the undefined element.

Is my analogy correct or am I mistaken?

(I have also attempted to use the splice method to remove the number however that then causes an issue with the length of my array because if I later want to remove another number, it removes the wrong one due to the numbers moving around etc).

You can use array.indexOf() to find the index of an element that you want to delete, then use the integer that it returns to delete whats in the array. — UghThatGUyAgain, Mar 08 '18 at 00:02
It seems like you're using the array as a set. Is preserving the order of the elements in the array important? If not, there are better approaches using set-like structures. — McCroskey, Mar 08 '18 at 00:10

score 1 · Answer 1 · answered Mar 08 '18 at 00:08

1

What you'd want to use is splice In your specific case, numbers.splice(1,1)

answered Mar 08 '18 at 00:08

Napoli

1,389
2
15
26

score 0 · Answer 2 · answered Mar 08 '18 at 00:06

0

If you mean to actually remove the element from the array, leaving your array with 4 elements, then you can use

numbers.splice(1);

This will remove the element in the index 1 from the array and return the section of the new array.

answered Mar 08 '18 at 00:06

Amit Beckenstein

1,220
12
20

Daniel Beck · Accepted Answer · 2018-03-08T00:18:46.193

You're correct that delete replaces one of the values in the array with undefined, and does not change the array length. Later on when you randomly choose an element from the array, you can wind up getting that undefined value, because it's still taking up a slot in the array:

var numbers = [0,1,2,3,4];
delete numbers[3];
console.log(numbers)

Instead use splice, which removes the item from the array completely:

var numbers = [0,1,2,3,4];
numbers.splice(3,1) /// remove one element starting at index 3
console.log(numbers)

if I later want to remove another number, it removes the wrong one due to the numbers moving around

You do need to choose one behavior or the other. If you need to preserve indexes as is, then continue to use delete, leaving the undefined values in the array, and rewrite your "choose one at random" function to never pick undefined values:

// start with some undefined values:
var numbers = [0, 1, undefined, undefined, undefined, 5]

var pickRandom = function(numbers) {
  // make a copy of the array, removing undefined elements:
  var definedValues = numbers.filter(function(item) {
    return item !== undefined;
  });
  if (definedValues.length === 0) {return false}
  //choose one at random:
  return definedValues[Math.floor(Math.random() * definedValues.length)]
}

// test it:
console.log(pickRandom(numbers));
console.log(pickRandom(numbers));
console.log(pickRandom(numbers));
console.log(pickRandom(numbers));

(...but note that this suggests that a simple array is the wrong data structure to use here; you may be better off with an array of objects each with an explicit ID, so you can reference specific ones as needed without worrying about keeping the array index the same.)

Though I'm almost certain I should be using another data structure, for the time being, I believe it'll do the job. Thank you for your in-depth answer and advice. — Akeem Zameer, Mar 08 '18 at 01:29

Do undefined elements in an array have an impact in JS?

3 Answers3