javascriptのオブジェクトをループさせる

javascriptで結構需要がある処理だと思われるオブジェクトのループについてです。

オブジェクトはforEachできない

forEachは配列に対して動作するので

let obj = {
  name: 'Jhon',
  age: 20,
  message: 'Hello'
}

上記のようなオブジェクトは
obj.forEach(e => {})とするとエラーになります。

どうするか

Object.keys()ってのを使います。

let obj = {
  name: 'Jhon',
  age: 20,
  message: 'Hello'
}

Object.keys(obj).forEach((e) => {
  console.log(e)
  console.log(obj[e])
})

こうすることでeにname、age、messageとキーが入ってきます。

なのでobj[e]としてやれば値が取得できます。

またforEachの第二引数を使って

Object.keys(obj).forEach((e) => {
  console.log(e)
  console.log(this[e])
}, obj)

のようにするとループ内のthisでobjが扱えます。

ループ内の関数で外の変数参照させたくないって思う方はこちらを使いましょう。

まとめ

オブジェクトをループで処理したいならObject.keys()を使いましょう。

オブジェクトをループで回すこと自体が設計ミスなのかもしれませんが、共通処理であったりはループでちゃちゃっと書きたかったりするので利用シーンは結構あると思います。