for-ofとforEachとmapの使い分け

1. for-of

for (const v of ["a", "b", "c"]) {
   if (v === 'x') {
       break;
   }
   console.log(v);
}

• 長所： 速い 💨
• 長所： 途中でbreakできる

参考

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/for...of

2. forEach()

["a", "b", "c"].forEach((v) => {
  console.log(v);
});

• 長所： 速い
• 短所： 途中でbreakできない

  例外を発生する以外の方法で、forEach() ループを止めることはできません。ループ中に中断する必要がある場合、forEach() メソッドは適切な方法ではありません。

  https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

参考

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

3. map()

var nums = [1, 2, 3].map((v) => {
  return v * 10;
});

console.log(nums);

• 長所： 値をreturnできて、新しい配列を作れる
• 短所： 遅い
• 短所： Set/Mapなどをループできない。配列にしか使えない
• 短所： 新しい配列を使わないならmap()を使うべきではない

  map() を使用すべきではない場合

  map は新しい配列を作成するので、返された配列を使わない場合、map を使うのはパターンに合いません。代わりに forEach または for-of を使用してください。

  https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/map#when_not_to_use_map

参考

• https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/map

補足: Map/Setなどのループ

var set = new Set([1, 2, 3]);
var map = new Map([
  ["a", 1],
  ["b", 2],
  ["c", 3],
]);

for (var v of set) {
  console.log(v);
}

map.forEach((v, k) => {
  console.log(k, v);
});

• https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Set
• https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Map

参考

https://stackoverflow.com/questions/50844095/should-one-use-for-of-or-foreach-when-iterating-through-an-array