js for、foreach、for in、for ofの違い

10496 ワード

開発においては、配列やオブジェクトを遍歴することが多く、for、foreach、for in、for ofなどの方法がよく使われています.1.forサイクル:forサイクルは常に行列に使われています.使い方も簡単です.
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は通常オブジェクトを遍歴するために使用されます.他のものは遍歴行列です.