Array of length 1 is created when using new Array(20)

Question

My function is following

export const addressGenerator = (total: number, type: AllowedAddressTypes) => {
    console.log("creating total of", total)
    const f = getExecutable(type)
    const result = new Array(total).map(_ => f())
    console.log(result)
    return result
}

I call it as

addressGenerator(20, 'city')

What I see in logs is

creating total of 20
[ 'South Malloryburgh' ]
result 20 [ 'South Malloryburgh' ]

But always an array of 1 is created. When I hardcode the line

new Array(20).map(_ => f())

I do see an array of 20 being created. Given that total is of number type, I am wondering what am I missing?

Can anyone give me a fresh perspective? Thank you

Yes, that's expected. It's why a lot of the answers in javascript create empty array of a given size have things like Array(4).fill(null). — zero298
– zero298, Commented Apr 15, 2021 at 17:45
Does this answer your question? Why do I need to copy an array to use a method on it? — ggorlen
– ggorlen, Commented Apr 15, 2021 at 17:46
Probably a better dupe, if anyone has a gold badge: JavaScript “new Array(n)” and “Array.prototype.map” weirdness — ggorlen
– ggorlen, Commented Apr 15, 2021 at 17:48

Mr. Polywhirl · Accepted Answer · 2021-04-15 17:55:45Z

3

You need to fill the array first, before you can map. Just because you designated a size for your array does not mean that the items exist in their positions yet.

new Array(20).fill(null).map(_ => f())

Alternatively, you could call the following:

Array.from(new Array(20), () => f())

or

Array.from({ length: 20 }, f)

There is an extensive list of strategies for creating and manipulating arrays here:

Hacks for Creating JavaScript Arrays

edited Apr 15, 2021 at 17:55

answered Apr 15, 2021 at 17:44

Mr. Polywhirl

49.1k12 gold badges96 silver badges147 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Array of length 1 is created when using new Array(20)

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related