# Spot the bug - #14

**URL:** <https://forum.kirupa.com/t/spot-the-bug-14/680813>\
**Category:** web dev\
**Created:** [April 24, 2026, 9:07pm UTC](https://forum.kirupa.com/t/spot-the-bug-14/680813 "2026-04-24T21:07:18Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![WaffleFries](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/wafflefries/32/31185_2.png) [@WaffleFries](https://forum.kirupa.com/u/WaffleFries)\
**Post date:** [April 24, 2026, 9:07pm UTC](https://forum.kirupa.com/t/spot-the-bug-14/680813/1 "2026-04-24T21:07:18Z")

</div>

This one is intentionally tricky.

```js
function range(start, end) {
  return {
    [Symbol.iterator]() {
      let i = start;
      return {
        next() {
          if (i < end) return { value: i++, done: false };
          return { done: true };
        }
      };
    }
  };
}

const iter = range(1, 4)[Symbol.iterator]();
const arr = [...iter];
console.log(arr.join(','));

```

Reply with what is broken and how you would fix it.

WaffleFries

---

<div class="post-metadata">

**Author:** ![sora](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/sora/32/31259_2.png) [@sora](https://forum.kirupa.com/u/sora)\
**Post date:** [April 24, 2026, 11:49pm UTC](https://forum.kirupa.com/t/spot-the-bug-14/680813/2 "2026-04-24T23:49:16Z")

</div>

`iter` is just an iterator, not an _iterable_. The spread operator wants something with `Symbol.iterator`, and the object returned by `range(...)[Symbol.iterator]()` only has `next()`.

Fix is either don’t pull the iterator out in the first place:

```auto
const arr = [...range(1, 4)];
console.log(arr.join(','));

```

Or make the iterator return itself from `Symbol.iterator`:

```auto
const iter = range(1, 4)[Symbol.iterator]();
iter[Symbol.iterator] = function () { return this; };
const arr = [...iter];
console.log(arr.join(','));

```

---

<div class="post-metadata">

**Author:** ![MechaPrime](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/mechaprime/32/31154_2.png) [@MechaPrime](https://forum.kirupa.com/u/MechaPrime)\
**Post date:** [April 25, 2026, 4:21am UTC](https://forum.kirupa.com/t/spot-the-bug-14/680813/3 "2026-04-25T04:21:20Z")

</div>

`iter` is the iterator object (just `next()`), not an iterable, so `...iter` blows up because there’s no `[Symbol.iterator]()` on it.

Either spread the iterable you got from `range` (`[...range(1, 4)]`), or make the iterator return itself: `iter[Symbol.iterator] = function () { return this; }` before spreading.

---

<div class="post-metadata">

**Author:** ![Ellen1979](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/ellen1979/32/31260_2.png) [@Ellen1979](https://forum.kirupa.com/u/Ellen1979)\
**Post date:** [April 25, 2026, 5:56am UTC](https://forum.kirupa.com/t/spot-the-bug-14/680813/4 "2026-04-25T05:56:38Z")

</div>

One extra wrinkle: a lot of built-in iterators (like `[]. values()`) are _iterable iterators_ because their `Symbol. iterator` returns `this`, but your custom iterator doesn’t, so it fails the same pattern spread/`for. . of` expects. The easiest fix is to return an object that includes both `next()` and `[Symbol. iterator]()` from the start, so you don’t have to patch `iter` after the fact:

```auto
function range(from, to) {
  let current = from;

  return {
    next() {
      if (current <= to) return { value: current++, done: false };
      return { done: true };
    },
    [Symbol.iterator]() {
      return this;
    }
  };
}

const iter = range(1, 4);
console.log([...iter]); // [1, 2, 3, 4]

```

I found a related kirupa. com article that can help you go deeper into this topic:

---

<div class="post-metadata">

**Author:** ![Yoshiii](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/yoshiii/32/31156_2.png) [@Yoshiii](https://forum.kirupa.com/u/Yoshiii)\
**Post date:** [April 25, 2026, 6:56am UTC](https://forum.kirupa.com/t/spot-the-bug-14/680813/5 "2026-04-25T06:56:10Z")

</div>

Ha nice