Unicode Playground絵文字・サロゲートペア・ZWJシーケンスを解析できるツール

絵文字やZWJシーケンスの「見た目の文字数」と、JavaScriptの.lengthで数えた値の違いを確認できるUnicode解析ツールです。

絵文字・サロゲートペア・ZWJシーケンスなどを分解しながら、UTF-16の.length、コードポイント数、書記素数の差を可視化できます。

※入力された値は収集されたり外部に送信されることはありません。詳しくはプライバシーポリシーをご覧ください。

* View in English

解析する文字列

複数行

文字の組み立てステップ 7/7： U+1F466 (EMOJI)

7/7表示結果：👨‍👩‍👧‍👦

UTF-16 length: 11.lengthプロパティ
UTF-8バイト数: 25TextEncoder
コードポイント数: 7[...str].length
書記素数: 1Intl.Segmenter

💡 ASTRAL (U+1F466)

このコードポイントはBMPの外（U+10000以上）です。UTF-16では2つのコード単位（サロゲートペア）に分割され、.lengthは2になります。
サロゲートペア：U+D83D + U+DC66

7 / 7

JavaScript で文字列を計測するサンプルコード

const string = "👨‍👩‍👧‍👦";

console.log(string.length); // > 11
console.log(new TextEncoder().encode(string).length); // > 25
console.log([...string].length); // > 7
const segmenter = new Intl.Segmenter('ja', { granularity: 'grapheme' })
console.log([...segmenter.segment(string)].length); // > 1

Tips

指標	内容
UTF-16 length	`str.length` UTF-16コード単位の数。サロゲートペア（U+10000以上）は2として数える。
UTF-8バイト数	`new TextEncoder().encode(str).length` UTF-8エンコード後のバイト数。ASCIIは1バイト、日本語は3バイト、多くの絵文字は4バイト。
コードポイント数	`[...str].length` Unicodeコードポイントの数。スプレッド構文はサロゲートペアを1と数える。
書記素数	`Intl.Segmenter` 人が「1文字」と認識する単位の数。ZWJ結合絵文字や国旗絵文字も1と数える。

💡書記素数が1なのに、バックスペース1回では消えない文字がある

Intl.Segmenter の書記素クラスタは「人が1文字と認識する単位」ですが、input要素やtextarea要素などの削除操作が常にその単位で動くとは限りません。

ブラウザやOSの実装によっては、ZWJ結合絵文字や結合濁点付きの「が」のように、見た目は1文字でも複数回のバックスペースが必要になることがあります。