What is the purpose of Symbol.iterator and how do you use it?

 // Built-in iterables use Symbol.iterator
 const arr = [1, 2, 3];
 const iterator = arr[Symbol.iterator]();

 console.log(iterator.next()); // { value: 1, done: false }
 console.log(iterator.next()); // { value: 2, done: false }
 console.log(iterator.next()); // { value: 3, done: false }
 console.log(iterator.next()); // { value: undefined, done: true }

 class Range {
   constructor(start, end) {
     this.start = start;
     this.end = end;
   }

   [Symbol.iterator]() {
     let current = this.start;
     const end = this.end;

     return {
       next() {
         if (current <= end) {
           return { value: current++, done: false };
         }
         return { done: true };
       }
     };
   }
 }

 const range = new Range(1, 5);
 for (const num of range) {
   console.log(num); // 1, 2, 3, 4, 5
 }

 console.log([...range]); // [1, 2, 3, 4, 5]

 class Countdown {
   constructor(start) {
     this.start = start;
   }

   *[Symbol.iterator]() {
     for (let i = this.start; i >= 0; i--) {
       yield i;
     }
   }
 }

 const countdown = new Countdown(5);
 console.log([...countdown]); // [5, 4, 3, 2, 1, 0]

 const fibonacci = {
   [Symbol.iterator]() {
     let prev = 0, curr = 1;
     return {
       next() {
         [prev, curr] = [curr, prev + curr];
         return { value: prev, done: false };
       }
     };
   }
 };

 // Get first 10 fibonacci numbers
 const fib10 = [];
 for (const num of fibonacci) {
   fib10.push(num);
   if (fib10.length === 10) break;
 }
 console.log(fib10); // [1, 1, 2, 3, 5, 8, 13, 21, 34, 55]