JavaScriptでは、ほかの言語を扱う時に比べて、エンコーディングでトラブルに巻き込まれることはほとんどありません。ブラウザがサーバのヘッダとHTMLを利用してしっかりと文字コードを認識してくれるので、普通にJavaScriptを作っていれば自動的に適切なエンコーディングに設定されます。しかし、時にはencodingのトラブルが発生するのは避けられません。今回はそんなときのテクニックの紹介です。
一番トラブルで多いのが、HTMLのエンコーディングとJSファイルのエンコーディングが違うために文字化けを起こしてしまうことです。HTMLがSJIS、JSがUTF-8で、JSの中の日本語の文字列が化けてしまうというのはありがちです。普通はJSのエンコーディングをHTMLにあわせて万事解決なんですが、事情によりそれが出来ないことが多々あります。たとえば複数のHTMLからそのJSを読んでいて、なぜかそれぞれのHTMLのエンコーディングが違う場合などですね。
そういう時に力技で解決するには、JSファイルに日本語を書かないのが一番です。JavaScriptは仕様で内部エンコーディングがUTF-16に決まっているので、文字列リテラルにエンティティ参照で書いてしまえばいいのです。具体的に言うと、
var str = "あいうえー";
これと
var str = "\u3042\u3044\u3046\u3048\u30fc";
これは完全に同じ内容のJavaScriptです。上は文字コードに気を使う必要がありますが、下はすべてアスキー文字で書かれているので、UTF-8で読もうがSJISで読もうがEUC-JPで読もうが何の問題もありません。ソースコード内の全部の日本語を下の形式で書いてしまえば、文字コードの問題は完全に解決です。
特にライブラリなどを作成する場合、この変換は必須です。普通はビルドステップの中で自動的に変換をしますね。大抵のJavaScript圧縮プログラムは上記の変換をしてくれるオプションがあると思いますが、手動で変換をされる方のためにここにも一応用意をしておきますね。
なお、XMLHttpRequestでresponseTextを取得する際に（古いブラウザではresponseXMLを取得する際でさえ）文字コードの問題が起こることもしょっちゅうありますが、これも上と似たような方法で回避することが出来ます。サーバから返却する文字列をエンティティ参照にして返して、evalしてしまえばいいのです。evalを使って評価するのにセキュリティ的な抵抗がある場合は、自前で解読してやることも可能です。
これはJavaScriptで日本語を使う際には広く知られているテクニックですが、今日久しぶりにこの問題にあたったのでブログ記事にしてみました。参考になれば幸いです。