How to generate range of numbers from 0 to n in ES2015 only? How to generate range of numbers from 0 to n in ES2015 only? arrays arrays

How to generate range of numbers from 0 to n in ES2015 only?


You can use the spread operator on the keys of a freshly created array.

[...Array(n).keys()]

or

Array.from(Array(n).keys())

The Array.from() syntax is necessary if working with TypeScript


I also found one more intuitive way using Array.from:

const range = n => Array.from({length: n}, (value, key) => key)

Now this range function will return all the numbers starting from 0 to n-1

A modified version of the range to support start and end is:

const range = (start, end) => Array.from({length: (end - start)}, (v, k) => k + start);

EDITAs suggested by @marco6, you can put this as a static method if it suits your use case

Array.range = (start, end) => Array.from({length: (end - start)}, (v, k) => k + start);

and use it as

Array.range(3, 9)


With Delta/Step

smallest and one-liner
[...Array(N)].map((_, i) => from + i * step);

Examples and other alternatives

[...Array(10)].map((_, i) => 4 + i * 2);//=> [4, 6, 8, 10, 12, 14, 16, 18, 20, 22]Array.from(Array(10)).map((_, i) => 4 + i * 2);//=> [4, 6, 8, 10, 12, 14, 16, 18, 20, 22]Array.from(Array(10).keys()).map(i => 4 + i * 2);//=> [4, 6, 8, 10, 12, 14, 16, 18, 20, 22][...Array(10).keys()].map(i => 4 + i * -2);//=> [4, 2, 0, -2, -4, -6, -8, -10, -12, -14]Array(10).fill(0).map((_, i) => 4 + i * 2);//=> [4, 6, 8, 10, 12, 14, 16, 18, 20, 22]Array(10).fill().map((_, i) => 4 + i * -2);//=> [4, 2, 0, -2, -4, -6, -8, -10, -12, -14]
Range Function
const range = (from, to, step) =>  [...Array(Math.floor((to - from) / step) + 1)].map((_, i) => from + i * step);range(0, 9, 2);//=> [0, 2, 4, 6, 8]// can also assign range function as static method in Array class (but not recommended )Array.range = (from, to, step) =>  [...Array(Math.floor((to - from) / step) + 1)].map((_, i) => from + i * step);Array.range(2, 10, 2);//=> [2, 4, 6, 8, 10]Array.range(0, 10, 1);//=> [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]Array.range(2, 10, -1);//=> []Array.range(3, 0, -1);//=> [3, 2, 1, 0]
As Iterators
class Range {  constructor(total = 0, step = 1, from = 0) {    this[Symbol.iterator] = function* () {      for (let i = 0; i < total; yield from + i++ * step) {}    };  }}[...new Range(5)]; // Five Elements//=> [0, 1, 2, 3, 4][...new Range(5, 2)]; // Five Elements With Step 2//=> [0, 2, 4, 6, 8][...new Range(5, -2, 10)]; // Five Elements With Step -2 From 10//=>[10, 8, 6, 4, 2][...new Range(5, -2, -10)]; // Five Elements With Step -2 From -10//=> [-10, -12, -14, -16, -18]// Also works with for..of loopfor (i of new Range(5, -2, 10)) console.log(i);// 10 8 6 4 2
As Generators Only
const Range = function* (total = 0, step = 1, from = 0) {  for (let i = 0; i < total; yield from + i++ * step) {}};Array.from(Range(5, -2, -10));//=> [-10, -12, -14, -16, -18][...Range(5, -2, -10)]; // Five Elements With Step -2 From -10//=> [-10, -12, -14, -16, -18]// Also works with for..of loopfor (i of Range(5, -2, 10)) console.log(i);// 10 8 6 4 2// Lazy loaded wayconst number0toInf = Range(Infinity);number0toInf.next().value;//=> 0number0toInf.next().value;//=> 1// ...

From-To with steps/delta

using iterators
class Range2 {  constructor(to = 0, step = 1, from = 0) {    this[Symbol.iterator] = function* () {      let i = 0,        length = Math.floor((to - from) / step) + 1;      while (i < length) yield from + i++ * step;    };  }}[...new Range2(5)]; // First 5 Whole Numbers//=> [0, 1, 2, 3, 4, 5][...new Range2(5, 2)]; // From 0 to 5 with step 2//=> [0, 2, 4][...new Range2(5, -2, 10)]; // From 10 to 5 with step -2//=> [10, 8, 6]
using Generators
const Range2 = function* (to = 0, step = 1, from = 0) {  let i = 0,    length = Math.floor((to - from) / step) + 1;  while (i < length) yield from + i++ * step;};[...Range2(5, -2, 10)]; // From 10 to 5 with step -2//=> [10, 8, 6]let even4to10 = Range2(10, 2, 4);even4to10.next().value;//=> 4even4to10.next().value;//=> 6even4to10.next().value;//=> 8even4to10.next().value;//=> 10even4to10.next().value;//=> undefined

For Typescript

interface _Iterable extends Iterable<{}> {  length: number;}class _Array<T> extends Array<T> {  static range(from: number, to: number, step: number): number[] {    return Array.from(      <_Iterable>{ length: Math.floor((to - from) / step) + 1 },      (v, k) => from + k * step    );  }}_Array.range(0, 9, 1);//=> [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];

Update

class _Array<T> extends Array<T> {  static range(from: number, to: number, step: number): number[] {    return [...Array(Math.floor((to - from) / step) + 1)].map(      (v, k) => from + k * step    );  }}_Array.range(0, 9, 1);

Edit

class _Array<T> extends Array<T> {  static range(from: number, to: number, step: number): number[] {    return Array.from(Array(Math.floor((to - from) / step) + 1)).map(      (v, k) => from + k * step    );  }}_Array.range(0, 9, 1);