Skip to content
Home » How to Use the Range2 Class in JavaScript for Generating Number Ranges?

How to Use the Range2 Class in JavaScript for Generating Number Ranges?

The Range2 class in JavaScript allows you to easily generate number ranges with customizable steps. Whether you need to iterate through a sequence of whole numbers or specify a starting point and a step, the Range2 class has got you covered. In this blog post, we will explore how to use the Range2 class with some examples.

Code

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]

Code Explanation

The code snippet provides an implementation of the Range2 class. The constructor of the Range2 class takes three parameters: to, step, and from. The to parameter represents the end value of the range, the step parameter represents the increment or decrement between each value, and the from parameter represents the starting point of the range.

The Symbol.iterator property is overridden with a generator function. This generator function uses a while loop to generate the values in the range. The loop runs until the current value, i, reaches the length of the range. The length is calculated based on the difference between to and from, divided by the step, and adding 1 to include the endpoint.

Let’s look at some examples of using the Range2 class:

Example 1: Generating the First 5 Whole Numbers

[...new Range2(5)]; // First 5 Whole Numbers
//=> [0, 1, 2, 3, 4, 5]

In this example, we create a new instance of the Range2 class with to set to 5. By spreading the instance into an array, we get the sequence of the first 5 whole numbers, starting from 0.

Example 2: Generating a Range with a Step of 2

[...new Range2(5, 2)]; // From 0 to 5 with step 2
//=> [0, 2, 4]

In this example, we create a new instance of the Range2 class with to set to 5 and step set to 2. By spreading the instance into an array, we get the sequence from 0 to 5, incrementing by 2 at each step.

Example 3: Generating a Range in Reverse Order with a Negative Step

[...new Range2(5, -2, 10)]; // From 10 to 5 with step -2
//=> [10, 8, 6]

In this example, we create a new instance of the Range2 class with to set to 5, step set to -2, and from set to 10. By spreading the instance into an array, we get the sequence from 10 to 5, decrementing by 2 at each step.

Conclusion

The Range2 class in JavaScript simplifies the process of generating number ranges. By specifying the start, end, and step values, you can easily generate sequences of numbers for various purposes. Whether you need to iterate through whole numbers or create a custom range, the Range2 class has the flexibility to handle your requirements. Start using the Range2 class today and optimize your number range generation process in JavaScript.

Also checkout the following codes.


How to Use the Range2 Function to Generate Number Ranges in JavaScript
How to Generate a Range of Numbers in TypeScript – Program to Create Number Range