for in/ofの使い分け
新しく追加された構文のfor/ofですが、for/inとの違いが分かりづらく、間違えてしまう人は多いのではないでしょうか。そこで実行結果を含めて使い分ける場面を紹介します。
ハッシュの場合
ハッシュの場合、ofは使えません。そのため、inだけです。
| let hash = { | |
| a: "b", c: "d", e: "f" | |
| }; |
このようにデータを取り出せます。返ってくるのはキー部分になります。
| for (let i in hash) { | |
| console.log(i); | |
| } | |
| // -> "a" | |
| // -> "c" | |
| // -> "e" |
どうしても of を使いたい場合は Object.keys を使う方法があります。
| for (let i of Object.keys(hash)) { | |
| console.log(i); | |
| } | |
| // -> "a" | |
| // -> "c" | |
| // -> "e" |
配列の場合
配列はin/of両方使えますが、返ってくる値が異なるので注意が必要です。
| let ary = ['a', 'b', 'c']; |
inだとキーが返ってきます。
| for (let i in ary) { | |
| console.log(i); | |
| } | |
| // -> 0 | |
| // -> 1 | |
| // -> 2 |
of だと値が返ってきます。
| for (let i of ary) { | |
| console.log(i); | |
| } | |
| // -> "a" | |
| // -> "b" | |
| // -> "c" |
昔ながらのやり方は以下のような感じでしょう。
| for (let i = 0; i < ary.length; i += 1) { | |
| console.log(i, ary[i]); | |
| } | |
| // -> 0, "a" | |
| // -> 1, "b" | |
| // -> 2, "c" |
さらに forEach も用意されています。こちらは of と同じ挙動です。
| ary.forEach((i) => { | |
| console.log(i); | |
| }); | |
| // -> "a" | |
| // -> "b" | |
| // -> "c" |
もしキーと値を両方取りたい時には ary.entries() が使えます。
| for (let [i, v] of ary.entries()) { | |
| console.log(i, v); | |
| } | |
| // -> 0, "a" | |
| // -> 1, "b" | |
| // -> 2, "c" |
of は本来、イテレーションを順番に実行するためのものです。配列もイテレーションですが、in/ofの使い分けが難しいので使わない方が安全かも知れません。安全な使い方としては、配列もハッシュもinを使ってキーを受け取りつつ、yieldを使った明確なイテレーションのみofを使うといった使い分けになるでしょう。
コメントは受け付けていません。