JavaScriptでは"false"はtrueとして扱われる

タイトルだけでは「そんなバカな」と思われるかもしれませんが、要はtruthy/falsyの話です。

JavaScriptでのTruthy/Falsy
仕様は、ECMAScript Language Specification - 9.2 ToBooleanにあります。これによれば、falseとして扱われるのは次の6つです。

1. undefined
2. null
3. false
4. 0
5. NaN
6. "" (空文字列)

Boolean関数を使って確認してみました。

"false"がtrueとして扱われることが確認できました。

問題になるケース

問題になるケースとしては、サーバーサイドの言語からJavaScriptへ、type="hidden"のinputのvalueへfalseをセットする場合が考えられます。サーバーでセットされた値を使用して、次のようなif文を書くと問題が発生します。

// <input id="someElement" type="hidden" value="false" />のとき
if (document.getElementById('someElement').value) {
    // このブロックが実行される
    ...
}

回避するには、明示的に"true"と比較するのがいいでしょう。

// <input id="someElement" type="hidden" value="false" />のとき
if ("true" === document.getElementById('someElement').value) {
    // このブロックは実行されない
    ...
}

JavaScriptの型は独特のゆるさがあるので、ついついチェックがあまくなりがちです。しかし、今自分がどんな型を扱おうとしているのか把握していないと、思わぬところでハマってしまいます。という記事でした。

おまけ
「Boolean型に変換するAPIはないのか」と思って調べてみましたが、次のような結果に。

参考
ECMAScript Language Specification

AngularJSとCompojureによる簡単なサンプル

Googleが開発しているAngularJS(以下angular)のバージョンが1.0になったらしいので、サンプルを作ってみました。最近はClojureに対する愛が高まっているので、サーバーサイドにはCompojureを選びました。angular-Compojure間をAjaxで通信することを目標に、一行掲示板のようなものを作りました。clj-anglr

苦労したこと
angularから送ったJSONをCompojure側で受け取るところ。

Compojureのサンプルを検索してすぐに見つかるのはBadのほうだと思いますが、この書き方ではangularから送ったJSONを受信できません。JSONはリクエストパラメータとしてではなく、リクエストのBODYに格納されるため、Goodのように自分でBodyから取り出す必要がありました。

感じたこと
angularのマッピングは快適です。特に$scopeへ追加したオブジェクトを更新すると、何もしなくても画面に反映されるのがすごいと思いました。業務で作っているシステムは頻繁に画面がちらつく・・・。
もう一つ、サーバーサイドにCompojureというのはアリだと思いました。Clojureのデータ構造はシンプルなのでJavaに比べてなんとなく不安でしたが、JavaScriptと通信する時にJSONに変換するのであれば、大して問題にならない気がしました。むしろ、無駄な情報がないために見通しがいいとも感じました。

業務で使うことはまだないと思いますが、なかなか興味深いライブラリでした。

Code Year 2012 - Week 8

今週は2回目のブラックジャックゲーム。
行数が多いので見にくい。JavaScriptにはJavaのimportにあたるような機能はないのかな？

Code Year 2012 - Week 7

今週の課題はループ。
forとwhileだけじゃなく、再帰を使ったループもあった。
再帰は普段使わないからけっこう手間取った。
8週目の課題がこなかったのはもたもたしてたからかな？

Code Year 2012 - Week 6

今週はprototype。
prototypeプロパティに代入することで、動的にクラス階層を変えられるのがすごい。

Code Year 2012 - Week 5

Week 4を飛ばしてWeek 5。Week 4はJavaScriptの基本的な部分だったので正直あまり面白くなかった。
Week 5は面白かった。Constructorメソッドやら、オブジェクトリテラルやら。
Week 6も結構楽しみ。

Code Year 2012 - Week 3

3週目。復習が多くていまいち物足りない。
switchで文字列が使えるのはJavaと違って便利よいね。
3項演算子も使い慣れると便利。これはJavaにもある。

Code Year 2012 - Week 2

Code Year 2012の２週目。関数のお勉強。
２週目は３つコースが用意されている。とりあえず一つ目をこなした。

Code Year 2012 - Week 1

Code Year 2012の1週目。
JavaScriptの入門。変数の定義から、分岐や繰り返しを学んだ。
回答はgistに保存している。自分の勉強の記録のつもり。
まだまだ簡単。