JavaScriptの真偽値判定について
JavaScriptの真偽値判定が独特な挙動を示すのでまとめてみました。
静的型付言語を主に扱っていると驚かされますね。
Flexigridのソースを眺めていたら以下のようなコードがあって「?」となったのですが
JavaScriptのブーリアン型への暗黙の型変換の仕組を知って合点がいきました。
onSubmitはサーバーへのAjax通信時に呼び出されるイベントなのですが
イベントハンドラの有無は利用者に委ねられています。
以下の要件を満たすためにこのような実装になっているようです。
ポイントはonSubmitにイベントハンドラが割当られるとif文がtrueになる点です。
イベントハンドラは関数オブジェクトになるのですがJavaScriptでは
ブーリアン型への暗黙の型変換によりオブジェクトはtrueとして扱われます。
・初期状態ではイベントハンドラがない
・利用者がイベントハンドラを設定した場合はそれを実行する
・通信前の状態チェックなどが実行されるイベントなので戻り値は真偽値になるべき
var onSubmit = false; (中略) if (onSubmit) { var gh = onSubmit(); if (!gh) { return false; } } ※説明のために実際のコードとは細部が異なります
ここでJavaScriptの真偽値判定の仕様が気になってきます。
急いでパーフェクトJavaScriptを見返すことに。
まとめると以下の値の場合はfalseとして扱われます。
逆に言えば、この値以外の場合はtrueです!
オブジェクトもtrueなんですよ!!
・数値 0、NaN
・null
・undifined
・空文字列
というわけで本当なのかと以下のコードで検証してみました。
検証結果は各値のコメント部分になります。
文字列は文字列長で判定しているのですかね。
変数や関数未定義でのundefined→falseはハマりそうですね。
function checkBoolean(val) { if (val) { console.log(val + ' is true'); } else { console.log(val + ' is false'); } } var obj = {}; checkBoolean(obj); // true checkBoolean(NaN); // false checkBoolean(undefined); // false checkBoolean(null); // false var hoge; checkBoolean(hoge); // false checkBoolean(0); // false checkBoolean(1); // true checkBoolean(0.1); // true checkBoolean(0.0); // false checkBoolean(""); // false checkBoolean(" "); // true checkBoolean("a"); // true