JavaScript String [Symbol.iterator]() Method

What You’ll Learn

String.prototype[Symbol.iterator]() makes strings iterable by yielding Unicode code points (same API as MDN String.prototype[Symbol.iterator]()). Learn for...of and spread, why surrogate pairs stay together, when emoji clusters still split, manual next(), five examples, and try-it labs.

Introduction

Strings implement the iterable protocol through [Symbol.iterator](). That is why you can write for (const ch of str) or [...str] and walk the text one Unicode code point at a time.

You almost never call the method yourself. Loops and spread call it for you. Call it manually when you want fine-grained control with iterator.next().

This page is part of JavaScript String Methods. Related topics include codePointAt() and charAt().

Understanding [Symbol.iterator]()

str[Symbol.iterator]() returns a new iterator object. Each next() call yields the next Unicode code point as a string.

• Makes strings work with for...of, spread, and Array.from.
• Iterates by code points — surrogate pairs stay as one value.
• Grapheme clusters (skin tones, ZWJ families) may still yield multiple values.
• Does not change the original string.

📝 Syntax

General form of String.prototype[Symbol.iterator]:

string[Symbol.iterator]()

Parameters

None.

Return value

A new iterable iterator object that yields the Unicode code points of the string as individual strings.

Exceptions

None for normal string values.

Common patterns

for (const ch of "Hi") { /* "H", "i" */ }

[..."𝐀"];                    // ["𝐀"]  — one code point (surrogate pair)

const it = "AB"[Symbol.iterator]();
it.next();                   // { value: "A", done: false }
it.next();                   // { value: "B", done: false }
it.next();                   // { value: undefined, done: true }

Examples Gallery

Examples follow MDN String[Symbol.iterator]() patterns. Use View Output or Try It Yourself for each case.

const str = "The quick red fox jumped over the lazy dog's back.";

const iterator = str[Symbol.iterator]();
let theChar = iterator.next();

while (!theChar.done && theChar.value !== " ") {
  console.log(theChar.value);
  theChar = iterator.next();
}
// "T"
// "h"
// "e"

T
h
e

const str = "A\uD835\uDC68B\uD835\uDC69C\uD835\uDC6A";

for (const v of str) {
  console.log(v);
}
// "A"
// "\uD835\uDC68"  (mathematical italic capital A)
// "B"
// "\uD835\uDC69"
// "C"
// "\uD835\uDC6A"

A
𝑨
B
𝑩
C
𝑪

const str = "A\uD835\uDC68";

const strIter = str[Symbol.iterator]();

console.log(strIter.next().value); // "A"
console.log(strIter.next().value); // "\uD835\uDC68"

A
𝑨

// Skin tone modifier
console.log([..."👉🏿"]);
// ['👉', '🏿']

// ZWJ family sequence
console.log([..."👨‍👦"]);
// ['👨', '‍', '👦']

👉,🏿
👨,‍,👦

const s = "𝐀"; // mathematical bold A (surrogate pair)

console.log(s.length);           // 2  (UTF-16 units)
console.log(JSON.stringify([...s]));      // ["𝐀"]
console.log(JSON.stringify(s.charAt(0))); // half of the pair
console.log(Array.from(s).join("-"));     // "𝐀"

2
["𝐀"]
"\ud835"
𝐀

🎯 Common Use Cases

• Loop characters safely — for...of over mixed ASCII + emoji text.
• Build arrays of code points — [...str] or Array.from(str).
• Early-exit scans — manual next() until a delimiter.
• Not grapheme clustering — skin tones / ZWJ may still split.
• Not UTF-16 indexing — use charAt / indexes when you need units.

📝 Notes

• You rarely call [Symbol.iterator] directly — prefer for...of.
• Surrogate pairs are preserved; grapheme clusters may still split.
• str.length counts UTF-16 units, not iterator steps.
• Lone surrogates yield as single broken units — pair with isWellFormed when needed.
• Each call to [Symbol.iterator]() creates a new iterator from the start.

💡 Best Practices