【JavaScript入門】for of と for in の違いについて

JavaScriptには、配列を繰り返し処理する場合、for of 、forEach、 for in を使用します。

ただ、なんとなく使用していると思わぬ不具合になる場合があります。

なぜ、for in を使用してはいけないか？

それは、for in はインデックスの順序通りに処理を行うことが保証されていないためです。

おそらく大抵の処理は、インデックス順で処理を行いたいことが多いと思いますので、日頃から for of、forEach を使用しているとミスがないと思います。

for of

<script>
var ary = [1,2,3,4,5];

for (var val of ary) {
  console.log( val );
}

// 1 2 3 4 5
</script>

var ary = [1,2,3,4,5];

for (var val of ary) {

console.log( val );

}

// 1 2 3 4 5

</script>

forEach

<script>
var ary = [1,2,3,4,5];

ary.forEach(val => console.log(val));

// 1 2 3 4 5
</script>

var ary = [1,2,3,4,5];

ary.forEach(val => console.log(val));

// 1 2 3 4 5

</script>

配列への繰り返し処理は、順序が保証される、for of もしくは forEach の使用をオススメします。

試しに、要素数20の配列を作成して、for in で繰り返し処理を行いましたが順序は1 〜 20 でした。順序が保たれているのでは？と思いましたが、仕様上順序が保たれないとなっているので、for of 、forEachを使用した方が安全です。

参考サイト