CODEWITHSUNDEEP
javascriptarraysecmascript-6undefined
mdn
mdn

Reputation: 93

Iterate over Array with empty elements (ES6)

I have an array with a specified length and I'm trying to populate it with values that are dependent on each index. 

let arr = new Array(someLength)
arr.map((v, i) => i * 2)

From what I know, this isn't working because map skips undefined values.

I have a few questions:

  1. Why does map work on something like [undefined, undefined]?

  2. Is there anyway to accomplish this using ES6 array methods?

    I know I can use a standard for loop, but was wondering if there's a nicer way to do it.

    for (let i = 0; i < arr.length; i++) { 
   arr[i] = i * 2 
}

    I've found one method so far, it's not really clean though.

    arr = arr.fill(undefined).map((foo, i) => i * 2)

Upvotes: 6

Views: 3613

Answers (3)

kevin ternet
kevin ternet

Reputation: 4612

You just have to fill the array with 0. Then you could process with map or forEach like this :

var arr = new Array(5); //[,,,,,]
arr.fill(0).forEach((v, i, tab) => {tab[i] = i * 2}); // [ 0, 2, 4, 6, 8 ]

Upvotes: 0

Nina Scholz
Nina Scholz

Reputation: 386680

You could generate an array with undefined values.

Array.apply(null, {length: 5})

and use it for the mapping.

var array = Array.apply(null, {length: 5});
console.log(array);

array = array.map((_, i) => 2 * i);
console.log(array);

Upvotes: 1

Paul S.
Paul S.

Reputation: 66364

  1. Why does .map work on something like [undefined, undefined]?

Consider these two scenarios

let a1 = [];
a1.length = 2;
a1; // [undefined × 2]

// vs

let a2 = [undefined, undefined];
a2; // [undefined, undefined]

What would be the result of Object.keys on each of these?

Object.keys(a1); // []
Object.keys(a2); // ["0", "1"]

So, we can see the difference between the two - one has initialised keys, the other doesn't

  1. Is there anyway to accomplish this using ES6 array methods?

You already pointed out .fill, you could also use Array.from

Array.from({length: 5}, (itm, idx) => 2 * idx); // [0, 2, 4, 6, 8]

Upvotes: 12

Related Questions