ES6/7 equivalent to underscore’s range function

Question

Is there any ECMAScript 6/7 equivalent to underscore’s range function?

In underscore:

_.range(startPage, endPage + 1);

In ES2015:

Array.from(Array(n), (_, i) => x + i)

Not sure how the ES2015 version works. I would like to know how range in ecmascript of javascript works

Answer 1

The idea is to create an array of length end - start + 1, and then fill it with the relevant numbers using Array#from.

The Array.from() method creates a new Array instance from an array-like or iterable object.

In this case Array#from needs an object with the length property. Using Array(n) creates such an object (array). You can also use { length: n } directly. In this case n = Math.abs(end - start) + 1.

Array#from accepts a mapFn callback, a function that can transform the iterated value. The function receives 2 params - the values (which we can ignore in this case), and the index (0 based). Adding start to the current index will create the numbers in the range.

const range = (start, end) => Array.from(
  Array(Math.abs(end - start) + 1), 
  (_, i) => start + i
);

console.log(range(5, 10));
console.log(range(-10, -5));
console.log(range(-5, 10));

This version will handle reverse range as well (large to small) as well:

const range = (start, end) => {
  const inc = (end - start) / Math.abs(end - start);
  
  return Array.from(
    Array(Math.abs(end - start) + 1), 
    (_, i) => start + i * inc
  );
};

console.log(range(5, 10));
console.log(range(-5, -10));
console.log(range(10, -5));