How to Create a Range of Numbers as an Array in JavaScript

This reference explains an individual array operation. For the learning sequence, start with JavaScript arrays and array transformations.

Generating a sequence of numbers—often referred to as a "range"—is a common task in programming. Whether you're populating dropdowns, iterating through page numbers, or generating test data, you’ll often need an array of numbers like [1, 2, 3, 4, 5]. While JavaScript doesn’t have a built-in range() function like Python, there are multiple elegant ways to create numeric ranges.

Let’s explore different methods to build number ranges in JavaScript, all explained step-by-step for beginners.

The classic approach. A for loop gives you the most control and works in all JavaScript environments. You define your start and end values and push each number into an array.

const start = 1;
const end = 5;
const range = [];

for (let i = start; i <= end; i++) {
  range.push(i);
}

console.log(range);

[1, 2, 3, 4, 5]

Array.from() is a powerful method to generate arrays from array-like or iterable objects. We can provide a mapping function to populate the values on the fly.

const length = 5;
const range = Array.from({ length }, (_, i) => i + 1);
console.log(range);

[1, 2, 3, 4, 5]

This technique creates an array with the desired number of elements using fill(), and then populates it using map(). It’s especially useful when you need more customization later.

const range = new Array(5).fill(0).map((_, i) => i + 1);
console.log(range);

[1, 2, 3, 4, 5]

If you need to generate ranges frequently, you can write your own reusable utility function. This makes your code cleaner and reusable across projects.

function range(start, end) {
  const result = [];
  for (let i = start; i <= end; i++) {
    result.push(i);
  }
  return result;
}

console.log(range(10, 15));

[10, 11, 12, 13, 14, 15]

Range arrays are helpful in many real-world scenarios:

• Rendering page numbers for pagination
• Creating dropdown options (like days 1 to 31)
• Generating indexes or mock data for testing
• Performing bulk operations on predictable sets of data

While JavaScript may not have a built-in range() function, its flexibility allows you to easily create one using loops, Array.from(), or fill().map(). Choose the method that fits your coding style and project needs.

Start with a loop if you're learning, and once you're comfortable, experiment with more concise solutions. Eventually, you might find yourself wrapping up your own range() function and reusing it across all your JavaScript apps.

Check whether the operation changes the original array, and test empty inputs and missing matches. Compare related operations in the reference library.