[JavaScript] ループの使い方と注意点

techback

2年前

Contents

1 for文
2 forEachメソッド
- 2.1 continue処理
3 for of
4 map
- 4.1 一行で記載
- 4.2 複数行で記載

for文

処理を繰り返すために使用。

for (let i = 0; i < 3; i++) {
  console.log(i)
}

> 0 
> 1 
> 2

forEachメソッド

for文の置き換えに。
空については処理されない。

const array = [1,2,3];

array.forEach((_,index) => 
  console.log(_ + ':' + index)
);

> "1:0" 
> "2:1" 
> "3:2"

continue処理

continueは無いので、returnステートメントで代替えする。

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];
numbers.forEach(function(number) {
   if (number % 2 === 0) {
     // 偶数の場合、処理をスキップして次の要素に進む
     return;
   }
   // 奇数の場合、要素を表示する
   console.log(number);
});

for of

var array = ['a', 'b', 'c'];

for (const item of array) {
  console.log(item);
}
> "a" 
> "b" 
> "c"

map

処理後の結果を配列で取得したい場合に使用。

一行で記載

const array = [1,2,3,4];

const array_map = array.map(_ => 処理);

複数行で記載

辞書配列を作る

const array = [1,2,3,4]; 

const array_map = array.map(_ => {
    return {
        aaa: _.name,
    }
});