for in/ofの使い分け

新しく追加された構文のfor/ofですが、for/inとの違いが分かりづらく、間違えてしまう人は多いのではないでしょうか。そこで実行結果を含めて使い分ける場面を紹介します。

ハッシュの場合

ハッシュの場合、ofは使えません。そのため、inだけです。

このようにデータを取り出せます。返ってくるのはキー部分になります。

どうしても of を使いたい場合は Object.keys を使う方法があります。

配列の場合

配列はin/of両方使えますが、返ってくる値が異なるので注意が必要です。

inだとキーが返ってきます。

of だと値が返ってきます。

昔ながらのやり方は以下のような感じでしょう。

さらに forEach も用意されています。こちらは of と同じ挙動です。

もしキーと値を両方取りたい時には ary.entries() が使えます。

of は本来、イテレーションを順番に実行するためのものです。配列もイテレーションですが、in/ofの使い分けが難しいので使わない方が安全かも知れません。安全な使い方としては、配列もハッシュもinを使ってキーを受け取りつつ、yieldを使った明確なイテレーションのみofを使うといった使い分けになるでしょう。

for…of – JavaScript | MDN