小さい頃はエラ呼吸

いつのまにやら肺で呼吸をしています。


jQueryで使われているwhileループのおもしろい書き方

先日、jQueryのソースを読む機会がありまして、そこでとても興味深いwhileループの書き方を見つけました。
例題として、"a","b","c"という値が格納された配列の中身を1つずつ取り出す処理を書いてみます。

典型的なwhileループの書き方
function loop1() {
  var i = 0, len;
  var array = new Array("a","b","c");
  len = array.length;
  while ( i < len ) {
    document.write(array[i]);
    i++;
  }
}

whileの終了条件にループカウンタi < len(配列長)を指定します。上記の例では、iが配列長(len)と同じ3になったときにループ処理を抜けます。この条件を満たすまでループカウンタiをインクリメントしています。

jQueryで用いられているwhileループの書き方
function loop2() {
  var i = 0, elm;
  var array = new Array("a","b","c");
  while ( (elm = array[ i++ ]) ) {
    document.write(elm);
  }
}

こちらは配列長(array.length)を取得せずに、配列の中身を1つずつ変数elmに格納していきます。
このループはどういう条件で終了するのかというと、(elm = array[ i++ ])がfalseになったときです。上記の例では、配列array[3]にアクセスすると、undefinedが返ってきます。undefinedはfalse扱いになるため、自動的にループを抜けます。*1

JavaScriptのfalse

ちなみに、以下のコードは上記のようには動作しません。なぜでしょうか?

function loop3() {
  var i = 0, elm;
  var array = new Array(0, 1, 2);
  while ( (elm = array[ i++ ]) ) {
    document.write(elm);
  }
}

JavaScriptでは非0をtrue、0をfalseとしています。このため、配列中に0が入っているとループが途中で終了してしまい、末尾まで走査することができないので、注意が必要です。

*1:このwhileループは、jquery-1.4.2.jsの1312行目に存在します。