『map』や『filter』を使った配列の処理

  • 投稿日
  • 著者 NKMR
  • カテゴリー JavaScript

map()

const nameArr = ['hoge', 'fuga', 'aaa'];
// 従来の繰り返し（for）
for (let index = 0; index < nameArr.length; index++) {
   console.log(nameArr[index]);
};
// ↑のforをmapで実行する（mapは配列を操作するメソッド）
nameArr.map((name) => {
   console.log(name);
});

冗長だったfor文での繰り返し処理をシンプルに記述し、同じ結果が得られるようになります。

filter

filterは配列の要素をフィルタリングして新しい配列をせ生成させます。

const numArr = [1, 2, 3, 4, 5];
// ↑の配列から奇数だけを取得して新しい配列を生成↓
const newNumArr = numArr.filter((num) => {
  return num % 2 === 1;
});
console.log(newNumArr); // (3) [1, 3, 5]
基本