jQuery.each()とブレイクと返り値 #JavaScript

jQueryを使いこなせるようになりたい途上。

連想配列ループ内で条件に合致したものを返り値として返そうとしたらハマったお話です。

ダメな例

function hogehoge(arr){
    $.each(arr, function(i, val){
        if (val.hoge1 == HOGE_HOGE) {
            return val.hoge2; //返したいつもり
        }
    });
}

returnで返したつもりでしたが、これが呼び出し元で受け取るとundefinedになっているという。

大丈夫な例

function hogehoge(arr){
    var res = '';
    $.each(arr, function(i, val){
        if (val.hoge1 == HOGE_HOGE) {
            res = val.hoge2;
            return false; //ループブレイク
        }
    });
    return res; //返り値
}

$.each()内のreturnはループのブレイクなんですね。
この後、ループの外の処理が実行されるので、ダメな例では返り値未定義になっていたというわけでした。

他の言語の感覚のままではいけませんね。。。

参考

JavaScript中級編 - return文の使い方
 jQuery .each()のループはbreakじゃ抜けれない
 JavaScript Array.forEachとjQuery.eachの違い