JavaScript | サロゲートペア

主な内容の要点

1. サロゲートペアとは

• JavaScript は文字を内部的に UTF-16 形式で扱う。
• UTF-16 では、基本多言語面（BMP, 0x0000～0xFFFF）に含まれる文字は 1 つの 16 ビットで表現できるが、Unicode の拡張により扱う文字数が増えると、16 ビットだけでは表現できない文字が出てくる。
• そのため、ある文字（特に絵文字や稀な記号など）は 2 つの 16 ビット “単位” を組み合わせて表される。この 2 つを 「上位サロゲート」 + 「下位サロゲート」 と呼び、これを合わせて サロゲートペア（surrogate pair） と呼ぶ。

2. なぜ注意が必要か

• JavaScript の String.prototype.length は、“16 ビット単位での要素数” を返すため、サロゲートペアで表現されている文字は「1文字」に見えても length は 2 を返す。
  • 例： '青' → length === 1
  • 例：絵文字など → length === 2（実際には “1文字” として扱いたいことも多い）
• そのため、文字列処理（例えば切り出し、インデックス指定、繰り返し処理など）を行う際には、サロゲートペアを意識しないと予期せぬ誤動作が起こる可能性がある。

3. サロゲートペアで使われる文字コード範囲

• UTF-16 の 16 ビット値のうち、0xD800 ～ 0xDBFF は上位サロゲート、0xDC00 ～ 0xDFFF は下位サロゲートとして予約されている。
• charCodeAt を使ってサロゲートペア構成文字を取得すると、最初の “上位サロゲート部分” と次の “下位サロゲート部分” のコードが返される。例として、文字 '●' を charCodeAt(0) と charCodeAt(1) で取得すると、それぞれ上位／下位のサロゲート値が得られる。