How to use Array.fill to create 0...499 in JavaScript?

Question

I want to use Array.fill method to create a sequence from 0...499 like

const arr = []
for(let i = 0; i < 500; i++)
   arr.push(i);

Currently, I am using Array.from like:

const arr = Array.from(Array(500).keys())

But how can I use just Array.fill to create the sequence? Is it even possible?

I don't think you can. `Array.fill` fills the array with the same values, not different values. — Barmar, Jul 05 '19 at 16:51
You can't DOC says _"The fill() method fills (modifies) all the elements of an array from a start index (default zero) to an end index (default array length) with a **static value**. It returns the modified array"._ — Maheer Ali, Jul 05 '19 at 16:53
Just use `Array.from`, i.e. `Array.from({ length: N }, (v, i) => i)` — Terry, Jul 05 '19 at 16:54
@Terry He knows the other methods. That's why I didn't close this as a dupe of https://stackoverflow.com/questions/55579499/efficient-way-to-create-and-fill-an-array-with-consecutive-numbers-in-range — Barmar, Jul 05 '19 at 16:55
https://stackoverflow.com/questions/3746725/how-to-create-an-array-containing-1-n — epascarello, Jul 05 '19 at 17:00

score 5 · Accepted Answer · answered Jul 05 '19 at 16:56

5

No you can't do it with fill alone as fill method adds a static value

The fill() method fills (modifies) all the elements of an array from a start index (default zero) to an end index (default array length) with a static value. It returns the modified array.

console.log(new Array(500).fill(0).map((_,i) => i ))
console.log(Array.from(Array(500).keys()))

answered Jul 05 '19 at 16:56

Code Maniac

37,143
5
39
60

I didn't downvote. But I'd use `forEach()` to modify the array that was created with `fill`, rather than creating a new array with `map()` – Barmar Jul 05 '19 at 16:58
@Barmar i have added that just as an example to demonstrate – Code Maniac Jul 05 '19 at 17:00

score 2 · Answer 2 · answered Jul 05 '19 at 17:17

It's not possible to use fill alone to do what you ask. You'll have to combine it with one or more other methods.

I can't say I recommend this approach, because it really doesn't feel like idiomatic JavaScript, but just for demonstration purposes, here's a solution that uses fill to populate the resulting array (instead of just using it to get around the awkwardness of the Array constructor). It's also more verbose and probably less performant than the alternatives.

console.log(Array.from({ length: 500 }).reduce((x, y, i, a) => (a.fill(i, i, i + 1), a), []))

For what it's worth, I find Array.from({ length: 500 }, (_, i) => i) as @Terry suggested to be a much more elegant.

I prefer `Array.from(Array(N),(_,i)=>i)` or `[...Array(N)].map((_,i)=>i)`.. although if it were possible, give me `Array(N).map(i)` any day. No one really uses `_` anyway. — bryc, Dec 27 '19 at 00:28

score 1 · Answer 3 · edited Feb 10 '22 at 08:46

1

You can use a one-line helper like this:

function createArrayWithNumbersFromRange(start: number, end: number): number[] {
  return [...Array(end - start + 1)].map((_, index) => start + index);
}

edited Feb 10 '22 at 08:46

Super Kai - Kazuya Ito

22,221
10
124
129

answered Feb 07 '22 at 08:35

Kirill Kushpel

101
6

score -2 · Answer 4 · answered Mar 24 '20 at 11:19

-2

You could generate an Iterator and push it to a new array.

[...Array(5).keys()];
 => [0, 1, 2, 3, 4]

answered Mar 24 '20 at 11:19

Pian0_M4n

2,505
31
35

the question is different – deadcoder0904 Mar 24 '20 at 11:21

How to use Array.fill to create 0...499 in JavaScript?

4 Answers4