snippetjavascriptTip
Initialize a JavaScript array with a given numeric range
Viewed 0 times
javascriptnumericarraywithrangeinitializegiven
Problem
Array initialization could be considered a fundamental JavaScript skill. Unfortunately, JavaScript lacks some of the built-in functionality that other languages have, such as Python's
> [!NOTE]
>
> All methods presented here will produce an array containing
We can use
range() function. Let's dive into building a JavaScript equivalent.> [!NOTE]
>
> All methods presented here will produce an array containing
start (inclusive) but not end (exclusive) for consistency with Python's range() method. To include the end value, you will have to alter the length formula and the mapping function accordingly.We can use
Array.from() for the purpose of creating a new array. We need to know the length of the array beforehand, which can be calculated from the range of numbers we want to include.Solution
const range = (end, start = 0, step = 1) =>
Array.from(
{ length: Math.ceil((end - start) / step) },
(_, i) => i * step + start
);
range(5); // [0, 1, 2, 3, 4]
range(7, 3); // [3, 4, 5, 6]
range(9, 0, 2); // [0, 2, 4, 6, 8]>
> All methods presented here will produce an array containing
start (inclusive) but not end (exclusive) for consistency with Python's range() method. To include the end value, you will have to alter the length formula and the mapping function accordingly.We can use
Array.from() for the purpose of creating a new array. We need to know the length of the array beforehand, which can be calculated from the range of numbers we want to include.The general formula for the
length of the array is (end - start) / step.All three values are supplied as function arguments. To make sure that the
length is an integer, we will use Math.ceil() to round up the result.If you want a reversed range, you might be tempted to use
Array.prototype.reverse() on the result of the previous snippet. However, this is relatively inefficient, as it requires iterating over the entire array twice.Code Snippets
const range = (end, start = 0, step = 1) =>
Array.from(
{ length: Math.ceil((end - start) / step) },
(_, i) => i * step + start
);
range(5); // [0, 1, 2, 3, 4]
range(7, 3); // [3, 4, 5, 6]
range(9, 0, 2); // [0, 2, 4, 6, 8]const rangeReverse = (end, start = 0, step = 1) =>
Array.from(
{ length: Math.ceil((end - start) / step) },
(_, i) => i * -step + end
);
rangeReverse(5); // [5, 4, 3, 2, 1]
rangeReverse(7, 3); // [7, 6, 5, 4]
rangeReverse(9, 0, 2); // [9, 7, 5, 3, 1]const range = (start, end, step) => {
if (end === undefined) [end, start] = [start, 0];
if (step === undefined) step = start < end ? 1 : -1;
return Array.from(
{ length: Math.ceil((end - start) / step) },
(_, i) => i * step + start
);
};
// Positive step value
range(5); // [0, 1, 2, 3, 4]
range(3, 7); // [3, 4, 5, 6]
range(0, 9, 2); // [0, 2, 4, 6, 8]
// Negative step value
range(5, 0, -1); // [5, 4, 3, 2, 1]
range(7, 3); // [7, 6, 5, 4]
range(9, 0, -2); // [9, 7, 5, 3, 1]Context
From 30-seconds-of-code: initialize-array-with-range
Revisions (0)
No revisions yet.