I found this code online and it works; however, I can't work out how!
Can anyone please explain how this code works?
const arr_seq = Array.apply(null, {
length: 10
}).map(Number.call, Number);
console.log(arr_seq)
Output is:
[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
Also, can anyone explain why this code, which I thought might do exactly the same thing, instead creates an array filled with undefined?
const arr_undef = Array(n).map(Number.call, Number);
Array.apply expects an array(-like) value for its second argument. It will then create an argument for each slot in this array-like object.
Since this code passes { length: 5 } as argument, the apply method will call Array with 5 values. But when reading { length: 5 }[i] for i in the range 0..4, it will always get undefined. So Array.apply(null, { length: 5 }) will translate to Array(undefined, undefined, undefined, undefined, undefined).
Then the .map call has a second argument, which is the thisArg argument. This ensures that not just call is called, but Number.call, i.e. with the right this setting. With Number.call the first argument will receive those undefined values (explained in the previous paragraph) and as second argument, the index of the mapping. So we get these calls:
Number.call(undefined, 0)
Number.call(undefined, 1)
Number.call(undefined, 2)
Number.call(undefined, 3)
Number.call(undefined, 4)
This gives the same result as:
Number(0)
Number(1)
Number(2)
Number(3)
Number(4)
And .map will return an array with those values.
Since ECMAScript 2015, JavaScript has Array.keys() and spread syntax for array literals. So we can now achieve the same in a less cryptic way:
console.log([...Array(5).keys()]);Array(n) creates an empty array of length 10; the map/Number.call part requires something to be there to get the index:
const arr = Array(5).fill(null).map(Number.call, Number);
console.log(arr);