初学者のかたですと、配列とオブジェクトが組み合わさったデータ構造の扱いに悩むかもしれません。ここでは、各組み合わせごとに要素を走査する方法を紹介します。
目次
配列
let array = [1, 2, 3]
array.forEach(elm => {
console.log(elm)
})
1
2
3
配列 – 配列
let array = [[1, 2, 3], [1, 2, 3]]
array.forEach(elm => {
elm.forEach(elm => {
console.log(elm)
})
})
1
2
3
1
2
3
配列 – オブジェクト
let array = [
{key1: 1, key2: 2, key3: 3},
{key1: 1, key2: 2, key3: 3}
]
array.forEach(elm => {
Object.keys(elm).forEach(key => {
console.log(`key: ${key} value: ${elm[key]}`)
})
})
key: key1 value: 1
key: key2 value: 2
key: key3 value: 3
key: key1 value: 1
key: key2 value: 2
key: key3 value: 3
オブジェクト
let object = {key1: 1, key2: 2, key3: 3}
Object.keys(object).forEach(key => {
console.log(`key: ${key} value: ${object[key]}`)
})
key: key1 value: 1
key: key2 value: 2
key: key3 value: 3
オブジェクト – 配列
let object = {
key1: [1, 2, 3],
key2: [4, 5, 6]
}
Object.keys(object).forEach(key => {
object[key].forEach(elm => {
console.log(elm)
})
})
1
2
3
4
5
6
オブジェクト – オブジェクト
let object = {
key1: {x: 1, y: 2},
key2: {x: 3, y: 4}
}
Object.keys(object).forEach(keyX => {
Object.keys(object[keyX]).forEach(keyY => {
console.log(`keyX: ${keyX} keyY: ${keyY} value: ${object[keyX][keyY]}`)
})
})
keyX: key1 keyY: x value: 1
keyX: key1 keyY: y value: 2
keyX: key2 keyY: x value: 3
keyX: key2 keyY: y value: 4