JavaScript Array.forEachとjQuery.eachの違い

jQueryのeachばかり使っていたので、forEachでちょっと躓きました。

コールバックの引数の順序が違う

jQuery.each

コールバックの第一引数がインデックス、第二引数が値

var a =[1,2,3,4,5]
$.each(a,function(index,val){

});

forEach

コールバックの第一引数が値、第二引数がインデックス、第三引数にforEachされている配列

var a=[1,2,3,4,5]
a.forEach(function(val,index,ar){
   console.log(a===ar); //trueになる
});

thisが違う

jQueryでは、thisは要素を指していたが、forEachではコールバック内のthisが参照するオブジェクトを指定できる。

var a=[1,2,3,4,5]
//jQuery
$.each(a,function(){
console.log(this); //1,2,3,4,5が、Numberクラスに変換されて表示される
});

//forEach
a.forEach(function(val){
    console.log(this); //undefinedが表示されるか、windowオブジェクトが表示される
});

var b = [5,6,7,8,9]
a.forEach(function(val,index){
    console.log(this[index]); //5,6,7,8,9が表示される
},b);

forEachはループから抜けられない

jQueryなら、コールバック関数内でreturn falseすれば、ループを中止できましたが、
forEachにはループを抜ける手段がありません。
ループを抜けたければ、someメソッドを使用します。

someメソッド

コールバック内で、falseを返せば処理を中断して次のループへ(continueと同じ）
trueを返せばループ自体を中断

つまりjQuery.eachと逆です。

var a=[1,2,3,4,5]
a.some(function(val,index){
   if(index==2) return false;
   console.log(index);
});
//結果 0,1,3,4が表示される

var a=[1,2,3,4,5]
a.some(function(val,index){
   if(index==2) return true;
   console.log(index);
});
//結果 0,1が表示される

以上です。