Learn how to easily create an array of any length without using loops in JavaScript.

Fortunately for a lot of developers, arrays in JavaScript don't need to have a specific length unlike other languages, like C++, where you need to specify the length, for example an array of 5 elements in C++:

#include <iostream>

using namespace std;

int main() {
    int arr[5] = {4, 1, 8, 2, 9};
    int len = sizeof(arr)/sizeof(arr[0]);
    cout << "The length of the array is: " << len;
    return 0;
}

In JavaScript this is quite flexible an way more simple:

let arr = [4, 1, 8 , 2, 9];

You may remove or add elements easier, compared to the mentioned high-level language. So if you want an array of N elements in JavaScript, you just need to push the new element to the array and that's it:

let arr = [];

// Number of items in the array
const N = 100;

for(let i = 0;i < N;i++){
    arr.push(i);
}

// Array with 100 items (0 .. 99)
console.log(arr);

Easy for a normal case! However, if you study, you may someday receive an assignment that requests the creation of an array of N elements without using any kind of loop (becomes tough right?). Don't worry, we got you covered! In this article, I will explain some of the possible ways to create an element with a defined length without using loops in JavaScript.

Note: some of the solutions will create empty arrays of a defined length, while others will indeed contain an element (a number) in every index. Use the solutions that best suits your needs.

1. Using the Array constructor

Using the constructor syntax of the array in JavaScript has been always known as something ambiguous, as you can both construct an array from elements, providing multiple arguments to the array constructor or construct an empty array with a predefined length if you provide a single argument. This is the first case, that creates an array of length 50:

let myArray = new Array(50);

console.log(myArray);

In the console, it will output something like:

Array Constructor JavaScript Array

Remember that Array constructors should not be used if you are going to manipulate them later as it may generate a confuse behaviour.

2. Creating an array with the spread operator

This solution will create an array with items, specifically the numerical values for every element in the array, as the keys() method returns a new Array Iterator object that contains the keys for each index in the array:

let myArray = [ ...Array(50).keys() ];

// Outputs an array with values: [0, 1, 2, 3 ... 49]
console.log(myArray);

If you want to start from 1 instead of 0, increase the number of elements by one and shift the first element:

let myArray = [ ...Array(51).keys() ];

myArray.shift();

// Outputs an array with values: [1, 2, 3, 4 ... 50]
console.log(myArray);

3. Using array.fill

The array.fill method of JavaScript changes all elements in an array to a static value, from a start index (default 0) to an end index (default set to the array.length) and returns the modified array. Then, using map we will set each element to the index:

let myArray = Array(50).fill().map((v,i)=>i);

// Contains an array with 50 items [0, 1, 2, 3 ... 49]
console.log(myArray);

If you want to start from 1 instead of 0, increase the number of elements by one and shift the first element:

let myArray = Array(51).fill().map((v,i)=>i);

myArray.shift();

// Contains an array with 50 items [1, 2, 3 ... 50]
console.log(myArray);

Happy coding ❤️!


Senior Software Engineer at Software Medico. Interested in programming since he was 14 years old, Carlos is a self-taught programmer and founder and author of most of the articles at Our Code World.

Sponsors