5

I am having an array which contains empty elements.

let arr = ['item 1', 'item 2', , 'item 3', , 'item 4', 'item 5'];

I am trying to find out if there is any empty element in an array by using Array.some() method but it returns false.

// Input array
const arr = ['item 1', 'item 2', , 'item 3', , 'item 4', 'item 5'];

// If you see in console, empty element has been filled with undefined
console.log(arr); // ["item 1","item 2",undefined,"item 3",undefined,"item 4","item 5"]

// Now I am just checking if is there any falsy value in an array. Ideally it should return true as we have undefined values in an arr but it is returning `false`.
console.log(arr.some(item => !item)); // false

There are so many other ways to check if is there any undefined values in an array but here I am specifically asking about the Array.some() behaviour. If I will explicitly replace the empty elements with undefined, then it will return true.

const arr = ['item 1', 'item 2', undefined, 'item 3', undefined, 'item 4', 'item 5'];

console.log(arr.some(item => !item)); // true

Why is it behaving like that? Please don't provide any alternate solutions as I am aware about other alternate solutions.

halfer
  • 19,824
  • 17
  • 99
  • 186
Debug Diva
  • 26,058
  • 13
  • 70
  • 123
  • 3
    sparse items are not iterated. what other approach do you want? – Nina Scholz Jul 26 '22 at 09:59
  • @NinaScholz, but in console and while map and print the index, I can see it iterates over an empty elements as well and assign undefined instead of the index. Here is the demo : https://jsfiddle.net/179f8y2o/ – Debug Diva Jul 26 '22 at 10:16
  • 2
    @RohìtJíndal It doesn't. What you are seeing is that JSFiddle displays those values as `undefined`. If you look at the console, [those values remain untouched/empty](https://i.stack.imgur.com/qrH97.png). – Ivar Jul 26 '22 at 10:27
  • 1
    @RohìtJíndal - Try this in your console: ```[1, , , 4].some((value, index) => { console.log(`Index ${index}: ${value}`); return value === undefined;});``` Note that you only see `Index 0: 1` and `Index 3: 4`, you don't see anything for the two gaps, because `some` doesn't call the callback for them. And that means your callback never returns `true`, so you get `false` from `some`. Compare with ```[1, , , 4, undefined].some((value, index) => { console.log(`Index ${index}: ${value}`); return value === undefined;});``` Notice that you see `Index 4: undefined` and `some` returns `true`. – T.J. Crowder Jul 26 '22 at 11:00

2 Answers2

8

See MDN:

The some() method executes the callbackFn function once for each element present in the array until it finds the one where callbackFn returns a truthy value (a value that becomes true when converted to a Boolean). If such an element is found, some() immediately returns true. Otherwise, some() returns false. callbackFn is invoked only for indexes of the array with assigned values. It is not invoked for indexes which have been deleted or which have never been assigned values.

You can see that here:

const arr = ['item 1', 'item 2', , 'item 3', , 'item 4', 'item 5'];
console.log(arr.some((item, index) => {
  console.log(item, index);
  return !item
}));

If I will explicitly replace the empty elements with undefined, then it will return true.

That's the difference between "never assigned a value" and "been assigned the undefined value".

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
0

The elements are actually empty and not undefined

const arr = ['item 1', 'item 2', , 'item 3', , 'item 4', 'item 5'];

// If you see in console, empty element has been filled with undefined
console.log(arr); 
VM146:4 (7) ['item 1', 'item 2', empty, 'item 3', empty, 'item 4', 'item 5']

Thats the reason the some script behaves differently. This thread does a good job on explaining stuff

Check the array has empty element or not

g.p
  • 312
  • 1
  • 5