Panda Noir

JavaScript の限界を究めるブログです。

JavaScriptで日本語が使えるという意外な事実

Javascriptでは、変数名、関数名で日本語が使えます。 しかし、日本語は文字の種類がとても多くて、gzip圧縮の恩恵をうけづらいです。 だから、Closure Compiler(Javascript圧縮ツール)では文字列中の日本語は全てUnicode表現に変換されています。

では識別子の方はUnicodeに変換されるのでしょうか?

検証

今回検証に使ったコードはこちら

会長=new Object;
会長.挨拶=function(名前){
    alert("おはよう、"+名前+"君。");
};
会長.きょどる=function(){
    alert("そ、そんなわけないだろう!!")
};
会長.年齢=17;
会長.性別="女"
会長.挨拶("ぱんだ")
会長.きょどる();

検証結果

さすがにそのままでは、見づらいので見やすくしてあります。

\u4f1a\u9577 = {
    "\u6328\u62f6": function (a) {
        alert("\u304a\u306f\u3088\u3046\u3001" + a + "\u541b\u3002")
    },
    "\u304d\u3087\u3069\u308b": function () {
        alert("\u305d\u3001\u305d\u3093\u306a\u308f\u3051\u306a\u3044\u3060\u308d\u3046!!")
    },
    "\u5e74\u9f62": 17,
    "\u6027\u5225": "\u5973"
};
\u4f1a\u9577.\u6328\u62f6("\u3071\u3093\u3060");
\u4f1a\u9577.\u304d\u3087\u3069\u308b();

どうやら「\u4f1a\u9577」が「会長」、「\u304d\u3087\u3069\u308b」が「きょどる」、「\u6328\u62f6」が「挨拶」のようですね。これを見るとClosure CompilerではUnicode変換した方がいいと判断しているようです。実際には変数名日本語にしてるとgzipしない方がサイズ小さかったりします。圧縮のはずがよりサイズ大きくなってしまうのは残念です。

まとめ

今回のまとめ。Closure compilerはローカル変数と引数は変数名を短くするので変数はローカル変数にしましょう。 ん?え?という声が聞こえてきそうですね。 よくみると、会長.挨拶の引数「名前」がaになっています。これは引数だからです。 というわけで会長はローカル変数にすると下のように変換されます。

(function () {
    var a = {
        "\u6328\u62f6": function (a) {
            alert("\u304a\u306f\u3088\u3046\u3001" + a + "\u541b\u3002")
        },
        "\u304d\u3087\u3069\u308b": function () {
            alert("\u305d\u3001\u305d\u3093\u306a\u308f\u3051\u306a\u3044\u3060\u308d\u3046!!")
        },
        "\u5e74\u9f62": 17,
        "\u6027\u5225": "\u5973"
    };
    a.\u6328\u62f6("\u3071\u3093\u3060");
    a.\u304d\u3087\u3069\u308b()
})();

ローカルなら変数に日本語つけてもいいですが、グローバル変数や関数、あとローカルの是非を問わずメソッドに日本語で名前をつけるのはやめておきましょう。圧縮すると惨劇になりますしコード打つ時いちいち日本語とアルファベットで入力モード切り替えるのは面倒極まりないです。複数人で開発する時はまずやめた方がいいでしょう。 ※この記事で出てきたすべてのコードはGoogle ChromeSafariで動作確認済みです。