Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to tell between undefined array elements and empty slots?

Suppose I am a user script developer and I don't have control over the on-page javascript. The page creates arrays with random lengths, filling them with random values (including falsy ones, such as undefined). Not every element has to be assigned a value, so there may be empty slots.

A simplified example (Firefox console):

var arr = new Array(3);
arr[0] = null;
arr[1] = undefined;
console.log(arr);               \\ Array [ null, undefined, <1 empty slot> ]
console.log(arr[1]);            \\ undefined
console.log(arr[2]);            \\ undefined
console.log(arr[1] === arr[2]); \\ true
console.log(typeof arr[1]);     \\ undefined
console.log(typeof arr[2]);     \\ undefined

As we can see, Firefox displays undefined and empty slots differently, whereas for javascript they seem to be identical.

Now suppose I want to clean such an array, removing all empty slots but leaving undefined elements intact. How do I do that?

like image 835
Chris Lopez Avatar asked Nov 22 '16 22:11

Chris Lopez


People also ask

How do you check if an array is empty or undefined?

To check if an array is empty or not, you can use the . length property. The length property sets or returns the number of elements in an array. By knowing the number of elements in the array, you can tell if it is empty or not.

Is an empty array the same as undefined?

Empty means that there's nothing in the slot, not even an undefined . But JavaScript has no empty value, so it returns undefined instead. We can use the in operator to see the empty array slot. (For arrays, x in a asks whether the array has something in index x.)

What are the slots in an array called?

Each of the bracket pairs is a slot(element) in the array, and you can put information into each one of them. It is almost like having a group of variables side by side.

What happens if an array is empty?

If the length of the object is 0, then the array is considered to be empty and the function will return TRUE. Else the array is not empty and the function will return False.


2 Answers

You can use the in operator to check if the array has a key. It will return false for empty slots, but true for slots with values, including the value undefined:

var arr = new Array(3);
arr[0] = null;
arr[1] = undefined;

1 in arr; // true
2 in arr; // false

Note that you can't distinguish between empty slots and slots past the end of the array using that, but if you know the length of the array, then you already know that 3 isn't part of it, so you don't need to test 3 in arr.

You can also filter out the empty slots like this:

arr = arr.filter( ( _, i ) => i in arr );
like image 132
Paul Avatar answered Sep 17 '22 08:09

Paul


You could use Array#forEach, which omits sparse elements.

var arr = new Array(3);
arr[0] = null;
arr[1] = undefined;
console.log(arr); 

var withoutSparse = [];

arr.forEach(function (a, i) {
    console.log(i);
    withoutSparse.push(a);
});
console.log(withoutSparse);
.as-console-wrapper { max-height: 100% !important; top: 0; }
like image 32
Nina Scholz Avatar answered Sep 17 '22 08:09

Nina Scholz