開発部だより 第221回
eラーニングコンテンツは一般のwebページに比べれば、いろいろな機能が搭載されています。ページを移動せずに表示を切り替えたり、ビデオや音声を再生したり、クイズに答えて判定して○×を表示したりといった機能です。
機能が増えればプログラムも増えて、更にタッチデバイス対応ならそれに対応するプログラムが増えてと、気が付いたら結構な量のスクリプトになってしまいます。
JavaScriptだったらオブジェクトにして更に機能ごとファイルを分けたり工夫しますが、記述が増えるほど後から見たときの理解が難しいですしデバッグも大変になります。
ではどうすれば良いか、これはプログラムをする人の多くを悩ませている問題だと思いますが、究極的にはシンプルに、しかも理に適ったプログラムをするしかないのでしょう。
そのためには仕様設計やらドキュメントも大切ですが、ブログラム記述にも工夫をしたいところです。
今回は、JavaScriptのswitch文での工夫をご紹介します。
JavaScriptを勉強する本を見ると、switch文のcaseラベルは通常リテラルで書かれています。
例）case 0: alert('0です');
ですが、ここは任意の式を記述することができます。リテラルでなくても判定できる内容が返れば良いわけです。
var num = 1;
switch (num) {
case (function() {return num})(): // ①即時関数
alert("①");
//break;
case num > 0? true: "": // ②三項演算子
alert("②");
//break;
case num > 0: // 条件
alert("③");
//break;
}
①即時関数
即時関数ならば何らかの処理をした結果をreturnで判定できます。普通に関数呼び出しを書いても変数への代入のようにはいきませんが、この方法なら大丈夫。
②三項演算子
関数を使用するほどでない条件分岐ならこの方法で。
③条件
ただの条件分岐で良いならこの方法で。
これらをうまく使用すれば複雑な条件分岐もシンプルに記述できます。
ちなみに三項演算子では、JavaScriptではあまり登場しない「：」が2回も出てきて面白い状態になります。
