JavaScript で配列要素をグループ化解除する

はじめに

この実験では、JavaScript を使って 2 次元配列の要素をグループ化解除する方法を探ります。reduce、map、forEachなどの JavaScript の組み込み関数を組み合わせて、1 つの 2 次元配列から個々の配列を抽出します。この実験が終わるとき、JavaScript で配列を操作して目的の出力を得る方法をしっかりと理解していることになります。

JavaScript で配列要素をグループ化解除する方法

zip関数で生成された配列の要素をグループ化解除するには、JavaScript のunzip関数を使って 2 次元配列を作成することができます。方法は以下の通りです。

ターミナル/SSH を開き、コーディングを練習するためにnodeと入力します。
Math.max()、Function.prototype.apply()を使って配列内の最長のサブ配列を取得し、Array.prototype.map()を使って各要素を配列にします。
Array.prototype.reduce()とArray.prototype.forEach()を使って、グループ化された値を個々の配列にマッピングします。

以下がunzip関数のコードです。

const unzip = (arr) =>
  arr.reduce(
    (acc, val) => (val.forEach((v, i) => acc[i].push(v)), acc),
    Array.from({
      length: Math.max(...arr.map((x) => x.length))
    }).map((x) => [])
  );

以下の例でunzip関数を使うことができます。

unzip([
  ["a", 1, true],
  ["b", 2, false]
]); // [['a', 'b'], [1, 2], [true, false]]
unzip([
  ["a", 1, true],
  ["b", 2]
]); // [['a', 'b'], [1, 2], [true]]

これらの手順に従えば、JavaScript で簡単に配列要素をグループ化解除することができます。

まとめ

おめでとうございます！あなたは配列要素をグループ化解除する実験を完了しました。あなたの技術を向上させるために、LabEx でさらに多くの実験を練習することができます。