Can modern javascript create an array of X number of things? (like `map` but on a number rather than-CodePudding

Given a number x , What's the nicest way of saying give me x number of a given string, object, whatever, and put them all in an array.

Ideally they'd have access to their index and that's about it.

I know I can create an array and push to that in a for loop (with i < x;) but I'd like it cleaner, and native, please.

This kind of syntax:

const arrayOfDivs = numberOfDivs.repeat(idx => html`<div id=${idx}></div>`;

// numberOfDivs == 3
arrayOfDivs == [
  '<div id=${0}></div>' , 
  '<div id=${1}></div>' ,
  '<div id=${2}></div>'   
]

And if there's no way like this, what do other people use, and can someone ask javascript to invent it?

I do a for loop and push to an array usually, but I remember creating a [0,1,2,3,4] array from the number before and .maping from that, bad times!

Thanks

CodePudding user response：

like map

Array.from has a very similar API to map. You could supply it with a number that goes to .length property of the first argument:

function createSeveral<Item>(count: number, itemFactory: () => Item): Item[] {
  return Array.from({ length: count }, itemFactory) as Item[];
}

So, for your case, you could use it like this:

Array.from({ length: numberOfDivs }, (element, index) => html`<div id=${index}></div>`)

CodePudding user response：

In ES6, you can create an array containing elements 1 to n using the spread syntax and Array.prototype.keys() (which you could then .map as you mentioned):

const arr = [...Array(10).keys()];
// arr => [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

If you want the same object repeated n times, you can use Array.prototype.fill():

const arr = Array(5).fill('x');
// arr => ['x', 'x', 'x', 'x', 'x']