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が表示される
以上です。