Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
2
Help us understand the problem. What is going on with this article?
@msakamoto_sf

JavaScriptとHTMLで、Unicodeのサロゲートペアを表示する練習

More than 3 years have passed since last update.

(2015-04-27 の練習メモからこちらに移転)

文字コードの復習をちょっとしてたら、Unicodeのサロゲートペアって今まで気にしたこと無かったことに気が付きました。
ということで、お仕事でも扱うJavaScriptとHTMLで、まずはサロゲートペアを「表示」してみる練習です。(2015-04時点のES5対応迄)

簡単にまとめると以下のようになります。

  • HTMLなら・・・
    • 𠮷𠮟 のような数値文字参照を使って、Unicodeコードポイントをそのまま16進数で表記すればOK.
  • JavaScript(ES5まで)とJSONなら・・・
    • サロゲートペア対象外の文字なら、\u(コードポイント16進数表現) をリテラルとして使える。
    • サロゲートペア対象の文字なら、サロゲートペアに分割し、\u(上位サロゲートの16進数表現)\u(下位サロゲートの16進数表現) とする。
  • ES6での予定(上記jsfiddleには組み込んでません)
    • サロゲートペア対象の文字でも、分割せずにそのまま \u{20BB7} (土吉) と表記できる。
    • String.codePointAt() によりサロゲートペアを分割せずにコードポイントを取り出せる。
    • RegExpで /u フラグが追加され、サロゲートペアを分割せずに1文字として処理できる。

今回は表示しか練習しませんでした。文字数のカウントなど、より実践的なテクニックについては以下の参考URLの一部で詳しく解説されてます。

また、ES6でのUnicodeサポートについては以下を参考にしました。

※hatena id:jser さんからのコメントをきっかけに、ES6でのUnicodeサポートについて追記

2
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
msakamoto_sf
PHP/Java/Groovy Programmer

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
2
Help us understand the problem. What is going on with this article?