js for、foreach、for in、for ofの違い
10496 ワード
開発においては、配列やオブジェクトを遍歴することが多く、for、foreach、for in、for ofなどの方法がよく使われています.1.forサイクル:forサイクルは常に行列に使われています.使い方も簡単です.
2.foreachサイクル:
for(let i=0,len=array.length;i<len;++i){
console.log(array[i])
}
このように配列の各々を遍歴することができ、breakまたはreturnによってループを終了することができる.なぜオブジェクトを遍歴できないですか?オブジェクトにはlengthという属性がありません.2.foreachサイクル:
array.foreach((item,index)=>{
console.log(item,index)
)}
書き方はforに対して簡潔ですが、forとの最大の違いは、breakまたはreturnを使ってサイクルを飛び出すことができないことです.ループを必ず飛び出すなら、try...catchを使うべきです.try{
array.foreach((item,index)=>{
if(some===item){
throw error
}
)}
}catch(error){
}
3.for inは、オブジェクトへの遍歴に一般的に使用されます.const obj={a:1,b:2}
for(let key in obj){
console.log(key ,obj[key]) //a ,1 b ,2
}
もちろん、オブジェクト自身の属性を遍歴する以外に、オブジェクトのプロトタイプ上の属性を遍歴することもできます.例えば、const obj={a:1,b:2}
obj.prototype.c=3;
for(let key in obj){
console.log(key ,obj[key]) //a,1 b,2 c,3
}
しかし、これを使って配列を巡るとしたら?const array=[1,2,3,4]
for(let key in array){
console.log(key ,array[key]) //0,1 1,2 2,3 3,4
}
配列も本質的に対象ですので、配列にも原型があります.たとえば、配列上のプロトタイプにも属性が追加されていると仮定します.const array=[1,2,3,4];
array.prototype.addPrototype=5;
for(let key in array){
console.log(key ,array[key]) //0,1 1,2 2,3 3,4 addPrototype,5
}
4.for of配列がプロトタイプ方法または属性を追加した場合、プロトタイプ上の方法を遍歴したくないです.ES 6はこのような方法を提供しています.主にfor inの欠陥を補うことです.const array=[1,2,3,4];
array.prototype.addPrototype=5;
for(let key of array){
console.log(key ,array[key]) //0,1 1,2 2,3 3,4
}
しかし、for ofは直接に対象を遍歴することができません.でなければ、「obj is not iterable」という報告があります.これを使って対象を遍歴したいなら、Object.keys()の方法が必要です.const obj={a:1,b:2}
for(let key of Object.keys(obj)){
console.log(key)
}
まとめ:1.機能が最も強いのはfor inで、配列を遍歴することもオブジェクトを遍歴することもできます.2.foreach以外はbreakまたはreturnでサイクルから飛び出すことができません.他のものは全部できます.3.for inは通常オブジェクトを遍歴するために使用されます.他のものは遍歴行列です.