JavaScriptは少し特殊な言語なので一見読みにくい変な書き方がよく使われていたりします。初心者はもちろんのことですが、他言語に慣れている人でも「なんじゃこれ？」こんなプログラム読めないわー！！！ということになります。
プログラミング言語って非常に難しいところなのですが、1文字一句、正しくよめないと、プログラムの動きが正確にはわからなかったりするので、一つでも知らないことがあると、途端にはまりこんでニッチもサッチもいかない、という状況におちいりがちです。
JavaScriptに慣れてくれば簡単に読み解くことができることでも、なれていないと、さっぱりわからない、ということになりかねません。
今からこの記事で扱う記述方法も、そのようなものの一つになります。
JavaScriptでは多用される記述方法なので、しっかり学んでおいてください。この記述方法が読めなければ人のプログラムを読むことができないんです。
以前書いた「&&」と「||」の基本的な使い方のページもリンクしておきます。
ORの特殊用法
では、サンプルコード見てみましょう。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
// -------------------- // [1] 普通の OR の使い方 var value1 = true; var value2 = false; var result = value1 || value2; console.log(result); // true と表示される // -------------------- // [2] 普通ではない OR の使い方 var value1 = 10; var value2 = 0; var result = value1 || value2; console.log(result); // 10 と表示される // -------------------- // [2] 普通ではない OR の使い方 var value1 = 0; var value2 = 10; var result = value1 || value2; console.log(result); // 10 と表示される // -------------------- // [3] 普通ではない OR の使い方 var value1 = 5; var value2 = 10; var result = value1 || value2; console.log(result); // 5 と表示される // -------------------- // [4] 普通ではない OR の使い方をしたオブジェクトの初期化 var obj = undefined; var obj = obj || {}; console.log(obj); // {} と表示される // -------------------- // [5] 普通ではない OR の使い方をしたオブジェクトの初期化 var obj = { test: 'test' }; var obj = obj || {}; console.log(obj); // { test: 'test' } と表示される |
特殊用法として、よく使われるのは、[4][5]の使い方です。これがわかりにくいので、それを説明するために[1][2][3]も書きました。
[1]は、通常の OR の使い方です。これは、true か false か、どちらかなら、true を返す、という、前に書いた記事の内容と同じ使い方。普通に動作だと思います。
[2]は、特殊な用法です。JavaScriptには、true属性 や false属性 というものがあると以前書きました。こちらの記事です。
value1 と value2 は数値ですが、ORを使うことで true属性 false属性として判断され、結果、true属性を持つ 10 が返されるという結果になっています。
わけわかりにくいですがORを表す記号「||」これは、２つの値の一方のTrue のものをみつけたらその値を返す、ということになります。
[3]もこの仕組みをつかった同じような動作を示しています。2つの値のどちらも true 属性 なので、先にみつかった value1=5 の値が result に入っています。
これをふまえて、[4] の書き方をみてみましょう。obj変数がundefined すなわち未定義の値ならば、false属性なので、無視して、オブジェクトリテラル「{}」によってオブジェクトを生成しています。
また[5]をみてみると、obj変数にすでにオブジェクトが入っている場合には、そのままオブジェクトの中身が入るようになっています。
つまり、下記の[A]の処理を書きたいが、短く済ましたいから、[B]の書き方で書いている、ということになります。
|
1 2 3 4 5 |
// [A] if (typeof obj === 'undefined') { obj = {} }; ↓ // [B] var obj = obj || {}; |
obj が未定義ならば、obj を生成する。すでに存在していれば、そのまま使う、ということです。
オブジェクトの値が生成されているのか、まだ未定義なのかを判断して初期値を指定したい場合には、このコードを書くと初期値としてオブジェクトが生成される、ということになります。
これが「OR」の特殊な用法になります。
ほんとーーーに、よく使い、しかも知らなければ読みとけないので、しっかり理解しておきましょう。
JavaScriptの実際の現場ではかなり使うと思います。