技術のメモ箱

JavaScript/繰り返し処理

while文

条件式がtruthyの間、処理を繰り返す。breakやcontinueも使える。

let i = 0;
while (i < 5){
    console.log(i);
    i++;
}

for文

for文

条件式がtruthyの間、処理を繰り返す。breakやcontinueも使える。

let numbers = [1, 2, 3, 4, 5];
for (let i = 0; i < numbers.length; i++) {
    console.log(numbers[i]);
}

for...in文

オブジェクトの要素に対して繰り返し処理を行う。配列には使わない。
取得するのは値ではなくプロパティ名。（列挙可能性が有効なプロパティのみ）
渡される要素の順番は保証されていない。

let obj = {one: 1, two: 2, three: 3};
for (const key in obj) {
    console.log(key);
}
// one
// two
// three

for...of文

反復可能なオブジェクトに対して繰り返し処理を行う。

let array = [1, 2, 3, 4, 5];
for (const value of array) {
    console.log(value);
}

通常のオブジェクトは反復可能ではないので、プロパティや値の配列を取得してから使う。

let obj = {one: 1, two: 2, three: 3};

for (const key of Object.keys(obj)) {  // ['one', 'two', 'three']
    console.log(key);
}

for (const value of Object.values(obj)) {  // [1, 2, 3]
    console.log(value);
}

for (const [key, value] of Object.entries(obj)) {  // [['one', 1], ['two', 2], ['three', 3]]
    console.log(key, value);
}

Mapオブジェクトに対して使うと、プロパティと値が格納された配列が渡される。
分割代入を使って書くと分かりやすい。

let map = new Map;
map.set("one", 1);
map.set("two", 2);

for (const row of map) {
    console.log(row[0], row[1]);
}

for (const [key, value] of map) {
    console.log(key, value);
}
pagetop