【JavaScript】ES6の便利な配列のメソッドfilter,map

はじめに

ES6(ES2015)で追加された便利な配列のメソッドfilter,mapについて説明します。

filterとは

コールバック関数内の条件を満たした配列を抽出するメソッド

const gosanke = [
  {'name': 'ヒトカゲ'   , 'type': 'ほのお'},
  {'name': 'ゼニガメ'   , 'type': 'みず'},
  {'name': 'フシギダネ' , 'type': 'くさ'},
];

const party = gosanke.filter(pokemon => {
  return pokemon.type === 'くさ';
});

// {'name': 'フシギダネ' , 'type': 'くさ'}

pokemonに配列の各要素は代入され、typeがくさのポケモンのみ抽出します。
returnを忘れないようにしましょう。

map()とは

配列から各要素を受け取って、新しい配列を作成するメソッド

const gosanke = [
  {'name': 'リザードン' , 'type': 'ほのお'},
  {'name': 'カメックス' , 'type': 'みず'},
  {'name': 'フシギバナ' , 'type': 'くさ'},
];

const party = gosanke.map(pokemon => {
  return `メガ${pokemon.name}`;
})

/* {'name': 'メガリザードン'},
   {'name': 'メガカメックス'},
   {'name': 'メガフシギバナ'} */

map()は配列に一部処理を加えて、新たな配列を作成するイメージです。すべての配列に似たような処理をしたい時に使います。
こちらもreturnを忘れないようにしましょう。

さいごに

初めての投稿です。これからも定期的に投稿していきます。

参考

初めてのJavaScript 第3版