100日後に完成するゲームシステム 42日目「![]ってどういう意味？」

ディープエンジニアを自覚する、弓削田です。 今回のゲームでのモジュール構成は、「マップシステム」「会話システム」「戦闘システム」「音システム」「モーションシステム」という感じに、 分割してプログラムファイル自体を分けて管理しているんですが、 ブログ用に、バージョン別にファイルを固めるという処理を行っています。 この際に、「Obfuscation」と言われる、要するに「難読化」処理をすることで、 １つのファイルに纏めるようにしています。

難読化処理のメリット

難読化処理というのは、次の通り、読む事を難しくする処理なのですが、 他にも、色々なメリットがあって、コメントなど、実行処理に関係ないコメントやタブや改行などを取り除いてくれるので、 プログラムファイルの全体容量が現象することにより、webシステムとしての、アクセストラフィックを下げることができます。 膨大な量のトラフィックが発生した時に、大きな効果が出てくるんですが、少ないアクセス数では、あまり感じられないかもしれないですね・・・ あと、複数あるファイルを１つのファイルとして、javascriptを固めることで、パケットヘッダの無駄を極限まで減らすことができ、http1.1での最大の問題、 ２ファイル制限を回避して、読み込み遅延問題をある程度解決してくれます。 あと、最大のメリットは、jsプログラムの内容を理解すると、データ解析などがしやすくなってしまうんですが、そうしたチート処理に対しての、簡易な防止策にはなります。 もちろん、コアプログラマーに対しては、何の効果もないですが、中級javascriptプログラマーレベルの人ぐらいであれば、 簡易に読むことができなくなるでしょう。

難読化処理ってどういうモノ？

難読化処理は、フリーで公開されているページがたくさんあるので、そうしたサイトで、変換を行って、ファイルを作るというのが 一番簡易な作り方ですが、 難読化処理がどういうモノか分からないという人のために、次のようなコードを用意してみました。 // Sample Code function view(s) { if(typeof s === "string"){ return true; } else{ return false; } } check("a"); これは簡単な、文字列判定をするだけのプログラムですが、これを難読化すると、 function view(a){return typeof a==='string'?!![]:![];}check('a'); こんな風になります。 なんとなく、中に命令文は見て取ることができますが、文字が別コードに変換されて、読みにくくなっている事がわかります。 でも、コードを置き換えていくと、復元ができるというのも見て取れますね。 難読化としての仕事は、低レベルに考えておいたほうがよさそうです。

![]の意味

個人的に興味があったので、難読化コードを調べていると、文字コードと連動しているというのがわかります。 そして、その中に書かれている typeof a==='string'?!![]:![]; この箇所の「![]」と「!![]」が気になったので、少し調査してみました。 プログラムと相対してみると、 ![] : false !![] : true ということはわかります。 そして、試しにコンソール画面に、![]と打ち込んでみると、falseが返ってくるではありませんか・・・！ そうか、[]という配列に対して、!という否定演算子を付けると、Booleanが返ってくるという事なんですね。 そして、!!は、論理否定演算の否定をするので、「論理肯定」となり、「true」が返ってくるという事。 う〜〜〜ん、おもしろい。 そして、個人的に考えたのが、これをもっと効率的にするには、次のようにも掛けますね。 !0 : true !!0 : fakse どうですか？１文字分少なくなって、より効率的じゃないですか？ そして、難読化もできるし・・・ こういう処理って、自分で作っても面白いかも・・・と考えてしまった・・・けど・・・ 早くゲームを仕上げたいので、無駄なモジュール構築は、避けることにしよう。