Unicode Support

ES6+ Unicode Support Overview

ES6 improved Unicode support in JavaScript by adding better string handling, code point escapes, Unicode-aware iteration, and regular expression support. These features help developers work correctly with emoji, international characters, and symbols outside the Basic Multilingual Plane.

Before ES6, JavaScript strings were often treated as UTF-16 code units, which caused bugs with characters like emoji and some non-Latin scripts. Modern Unicode features make string length, indexing, matching, and iteration much more reliable.

Basic Unicode Code Point Example

const smiley =
  "\u{1F604}";

console.log(smiley);
console.log(smiley.codePointAt(0));

const heart =
  String.fromCodePoint(0x2764, 0xFE0F);

console.log(heart);

ES6 allows Unicode escapes beyond four hex digits using \u{...}, and String.fromCodePoint() creates strings from numeric code points.

How ES6 Unicode Support Works

JavaScript strings are still stored internally as UTF-16, but ES6 adds tools to work with full Unicode code points instead of only 16-bit units. This matters for emoji and many international characters that use surrogate pairs.

The UTF-16 Problem with Emoji

const emoji = "😄";

console.log(emoji.length);
console.log(emoji[0]);
console.log(emoji[1]);

console.log(
  emoji.codePointAt(0)
);

for (const char of emoji) {
  console.log(char);
}

Emoji and some Unicode characters use two UTF-16 code units, so length and bracket indexing can give misleading results. Use codePointAt() or for...of for safer character handling.

Read Code Points with codePointAt()

const text = "A😄Z";

console.log(text.charCodeAt(1));
console.log(text.codePointAt(1));
console.log(text.codePointAt(2));

function getCodePoints(value) {
  const points = [];

  for (let i = 0; i < value.length; i += 1) {
    const point =
      value.codePointAt(i);

    points.push(point);

    if (point > 0xffff) {
      i += 1;
    }
  }

  return points;
}

console.log(getCodePoints(text));

codePointAt() returns the full Unicode code point at an index, even when the character spans a surrogate pair.

Create Strings with fromCodePoint()

const greeting =
  String.fromCodePoint(
    72,
    101,
    108,
    108,
    111
  );

const symbols =
  String.fromCodePoint(
    0x1F680,
    0x1F30D,
    0x2728
  );

console.log(greeting);
console.log(symbols);

String.fromCodePoint() builds strings from one or more numeric code points. It is safer than manually combining surrogate pairs.

Iterate Unicode Characters Safely

const message = "Hi 😄🌍";

console.log([...message]);
console.log(message.split(""));

for (const char of message) {
  console.log(char);
}

Spread syntax and for...of iterate by Unicode code point, while split("") splits by UTF-16 code units and can break emoji into invalid pieces.

Normalize Unicode Text

const composed = "café";
const decomposed = "caf\u0065\u0301";

console.log(composed === decomposed);
console.log(
  composed.normalize("NFC") ===
  decomposed.normalize("NFC")
);

console.log(composed.normalize("NFD"));
console.log(decomposed.normalize("NFC"));

Different Unicode sequences can look identical on screen. normalize() helps compare and store text consistently using forms such as NFC and NFD.

Unicode-Aware Regular Expressions

const text = "Hello 😄 2026";

const emojiPattern =
  /\p{Extended_Pictographic}/u;

console.log(
  emojiPattern.test(text)
);

const wordPattern =
  /\w+/u;

console.log(
  text.match(wordPattern)
);

The u flag enables Unicode-aware regex behavior. With Unicode property escapes, you can match emoji classes and other character categories more reliably.

Count Unicode Characters Correctly

function getUnicodeLength(value) {
  return [...value].length;
}

function getFirstCharacter(value) {
  return [...value][0];
}

const username = "User😄";

console.log(username.length);
console.log(getUnicodeLength(username));
console.log(getFirstCharacter(username));

When building input limits, avatars, or text previews, count visible characters with spread syntax or Array.from() instead of relying on string.length alone.

Common Unicode-Related Methods

Common Unicode Support Use Cases

• Handling emoji in chat apps, comments, and reactions.
• Building internationalized forms and search features.
• Validating usernames with non-ASCII characters.
• Counting visible characters in input limits.
• Comparing text safely during authentication or search.
• Parsing social content, hashtags, and multilingual labels.

Unicode Support Best Practices

• Do not rely on string.length for visible character counts.
• Prefer for...of or spread syntax when iterating strings.
• Use normalize() before comparing user-entered text.
• Use codePointAt() and fromCodePoint() for emoji and rare symbols.
• Add the u flag when regex should treat characters correctly.
• Test with emoji and non-Latin scripts, not only ASCII examples.
• Store text in a consistent normalized form in databases when possible.

Common Unicode Mistakes

• Assuming one character always equals one UTF-16 code unit.
• Using split("") on emoji-heavy strings.
• Comparing visually identical strings without normalization.
• Using charCodeAt() when codePointAt() is needed.
• Building regexes without the Unicode u flag.
• Setting maxlength based on string.length for social usernames.
• Testing Unicode features with ASCII-only sample data.

ES6 Unicode vs Legacy String Handling

Key Takeaways

• ES6 added better Unicode handling for modern international text and emoji.
• \u{...}, codePointAt(), and fromCodePoint() work with full code points.
• for...of and spread syntax iterate characters more safely than index access.
• normalize() helps compare equivalent Unicode text consistently.
• Unicode-aware regex and testing with real multilingual input are important in production.