Flutter/DartでTypescriptのList.mapのようにindexを取得できるようにする

はじめに

Flutter/Dartでアプリケーション開発を行う際、Listの各要素に対して何らかの操作を行いたいケースは数多くあります。特に、Listの各要素に対して何らかの変換を行いたいときに`map`メソッドを使用します。しかし、単に要素に変換を加えるだけでなく、その要素のインデックスも知りたい場合があります。この記事では、Listの`map`を使用して各要素のインデックスを取得する方法について解説します。

やりたいこと

Typescriptだとlist.mapを利用すると要素のほかにindexも一緒に取得することができます

const lists = ["要素１","要素2"];
lists.map((item, index) => {
  console.log(index,item);
});

上記だと、「0 要素1」のようにindexが取得できますがFlutter/Dartだとこれができないため、個別にリストを拡張する必要があります

extensionを用いてlistを拡張する

indexをflutterで取得するにはリストを一旦asMapでmapに変換してからentries.mapで取得することができますが、
このやり方を毎回行うのはめんどくさいので、今回はextensionでリストを拡張します

extension MapWithIndex on List {
  List mapWithIndex(T Function(E item, int index) f) {
    return asMap().entries.map((entry) => f(entry.value, entry.key)).toList();
  }
}

上記を追加すると下記であるようにindexをmapWithIndexを用いてindexを取得することができます

final lists = ["要素１", "要素2"];
lists.mapWithIndex((item, index) => print("$index $item"));

このように他の言語にあってdartにはない機能は個別に拡張することができます
これを使うことでリストのグループ化なども行うことができます