【JS】Objectをループ処理はObject.entries()が便利

皆さん、こんにちは！

今回は、JSでObjectをループで処理するときについてです。

Object.entries()を使用すると簡潔に書けます
他の方法でObjectのループを回すには？

Object.entries()を使用すると簡潔に書けます

Object.entries()を使用してObjectのループを書けます。

実際に書いてみましょう！

const testObj = {
  "key01": "AAA",
  "key02": "BBB"
}

for ([key, value] in Object.entries(testObj)) {
  console.log(`${key}: ${value}`);
}

# or
Object.entries(testObj).forEach(([key, value], index) => {
  console.log(`${key}: ${value}`);
})

こんな感じで書けます！

key&valueをそのままforループ内で使用できるので、便利ですね。

※Internet Explorerでは動作しないので、注意が必要！

他の方法でObjectのループを回すには？

他には、keyの配列でforループを回してvalueをとる方法もあります。

const testObj = {
  "key01": "AAA",
  "key02": "BBB"
}

Object.keys(testObj).forEach(key => {
  console.log(`${key}: ${testObj[key]}`);
})

単にObjectのvalueのみが、ほしい場合は以下でもいいですね。

const testObj = {
  "key01": "AAA",
  "key02": "BBB"
}

Object.values(testObj).forEach((value, index) => {
  console.log(`${value}`);
})