103 of 264 menu

mapメソッド

メソッドmapは、配列の各要素に指定された 関数を適用することを可能にします。この メソッドは元の配列を変更せず、 変更された新しい配列を返します。

このメソッドはパラメータとして、配列の各要素に対して 実行される関数を受け取ります。 その関数がreturnを通して配列の要素に対して返す値が、 その要素の新しい値となります(例を参照)。

関数には3つのパラメータを渡すことができます。 これらのパラメータが存在する場合(必須ではありません)、 最初のパラメータには自動的に配列の要素が、 2番目のパラメータにはその配列内での番号(インデックス)が、 3番目のパラメータには配列自体が渡されます。

構文

let 新しい配列 = 配列.map(function(要素, インデックス, 配列) { コード return 変更された要素; });

元の配列の対応する要素の2倍の値を持つ 新しい配列を作成しましょう:

let arr = [1, 2, 3, 4, 5]; let res = arr.map(function(elem) { return elem * 2; }); console.log(res);

コード実行結果:

[2, 4, 6, 8, 10]

各要素の値が「要素の値 × 配列内での順番(インデックス)」 となる配列を作成しましょう:

let arr = [1, 2, 3, 4, 5]; let res = arr.map(function(elem, index) { return elem * index; }); console.log(res);

コード実行結果:

[0, 2, 6, 12, 20]

必要に応じて、3番目のパラメータに配列自体を 渡すことができます:

let arr = [1, 2, 3, 4, 5]; let res = arr.map(function(elem, index, arr) { // ここで配列arrが利用可能になります });

メソッドmapは多次元配列の走査にも 使用できます。例えば、次のような配列が与えられたとします:

let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];

この配列をmapで走査し、 その要素をコンソールに出力してみましょう:

let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]; let result = arr.map(function(elem) { console.log(elem); });

結果としてconsole.log[1, 2, 3]、次に[4, 5, 6]、 その次に[7, 8, 9]を出力します。

ご覧の通り、変数elemには部分配列(サブ配列)が 渡されます。では、各サブ配列にmapメソッドを 適用して、その各要素を2乗してみましょう:

let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]; let result = arr.map(function(elem) { return elem.map(function(num) { return num * num; }); }); console.log(result);

関連項目

  • メソッド forEach,
    配列の各要素に関数を適用します
  • メソッド filter,
    配列の要素をフィルタリングすることを可能にします
  • メソッド someevery,
    配列のチェックを行います
  • メソッド reducereduceRight,
    配列を単一の値に畳み込みます
日本語
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItalianoქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
当サイトでは、サイトの動作、分析、パーソナライゼーションのためにクッキーを使用しています。 データ処理はプライバシーポリシーに従って行われます。
すべて受け入れる 設定 拒否