【JSリファレンス】Array.prototype.flatMap()

更新日：2024/06/14

初出：ECMAScript2019


Array.prototype.flatMap()は、Arrayオブジェクト(Arrayコンストラクターのインスタンス)のプロトタイプチェーンに組み込まれるメソッドです。
配列内の配列要素をコールバック関数に渡して、戻り値で新しい配列を作成します。
その後、配列内の配列要素を展開した新しい配列を返します。

欠番インデックスは無視され、生成後の配列は切り詰められます。

 

■構文


Array.prototype.flatMap ( mapperFunction [ , thisArg ] )
  1. mapperFunction: 各要素毎に呼び出される関数

    配列内の配列要素は、配列のまま渡されます。（再帰的な呼び出しはありません）

  2. thisArg: 省略可能。
    mapperFunctionに渡されるthis値

    ※this値を渡す場合、mapperFunctionはアロー関数ではなくfunctionで定義する

Array.prototype.flat()は展開の深さを指定できましたが、このメソッドの展開の深さは 1 固定です。

生成された配列

 

■mapperFunctionの構文


mapperFunction ( value , index , array ){ return booleanValue; }
  1. value: 要素の値
  2. index: 要素のインデックス
  3. array: 対象となっている配列
値

 

■使用例

const array = [1,2,[3,4],[5,6,[6,7]]];
const array2 = array.flatMap(
    e=>Array.isArray(e) ? e : e * 2
  );
console.log( array2 ); // [ 2, 4, 3, 4, 5, 6, [ 6, 7 ] ]

 

■備考

call()等でアレイライクオブジェクトを対象にすることも可能です。

const arrayLike = {0:1,1:2,2:[4,5],length:3};
const array = Array.prototype.flatMap.call( 
    arrayLike , e=>Array.isArray(e) ? e : e * 2
  );
console.log( array ); // [ 2, 4, 4, 5 ]

更新日：2024/06/14

書いた人（管理人）：けーちゃん

スポンサーリンク

記事の内容について

null

こんにちはけーちゃんです。
説明するのって難しいですね。

「なんか言ってることおかしくない？」
たぶん、こんなご意見あると思います。

裏付けを取りながら記事を作成していますが、僕の勘違いだったり、そもそも情報源の内容が間違えていたりで、正確でないことが多いと思います。
そんなときは、ご意見もらえたら嬉しいです。

掲載コードについては事前に動作確認をしていますが、貼り付け後に体裁を整えるなどをした結果動作しないものになっていることがあります。
生暖かい視線でスルーするか、ご指摘ください。

ご意見、ご指摘はこちら。
https://jsref.affi-sapo-sv.com/info.php

 

このサイトは、リンクフリーです。大歓迎です。