JavaScriptのきほんを学ぼう
■第23話:配列、連想配列操作の実践例
(最終更新日:2023.05.20)

(絵が小さい場合はスマホを横に)
「実践的なコードを書きたい!」
これまで、JavaScriptの配列と連想配列に関する基本的な操作と特性について説明してきた。
今回は今までの操作を応用して、実践的な配列と連想配列の操作方法について説明する。
JavaScriptの配列と連想配列は、その柔軟性と強力な機能により、データの格納、操作、
アクセスにおける多くの問題を解決するための有効な手段を提供する。
それらを最大限に活用することで、より効率的で読みやすく、再利用可能なコードを作成することができる。
さらに、これらのデータ構造を理解することは、アルゴリズムの設計とその最適化においても重要である。
適切なデータ構造を選択することで、計算時間を大幅に削減し、より速く、より複雑な問題に対処できるようになる。
今回の実践例を踏まえて、より価値の高いプログラミングを目指してほしい。
1. データのグループ化
JavaScriptの配列や連想配列は、データをグループ化するのに非常に便利だ。 例えば、同じ属性を持つオブジェクトをまとめて扱いたい場合や、特定の条件に基づいてデータを分類したい場合などに用いる。 JavaScriptのreduceメソッドを使用すると、配列内のデータを効率的にグループ化することができる。 この関数は、配列の各要素に対して、単一の出力値を生成する。その際、累積値と配列の各要素を引数に取る。 以下に、データのグループ化の一例を示す。typeごとに分けることができた。
reduceメソッドによるデータのグループ化
このように、reduce関数を用いることで、データのグループ化を行うことが可能である。 特定のキー(ここでは動物の種類)でデータをまとめ、それぞれのグループに所属する要素を配列として格納するのに便利である。
2. ソートアルゴリズムの実装
配列のソートは非常に一般的な操作で、様々なソートアルゴリズムが存在する。
ここでは、JavaScriptでのバブルソートとクイックソートの実装について説明する。
バブルソートは最も基本的なソートアルゴリズムの一つで、隣接する要素を比較して必要に応じて交換する。
これを配列の終わりまで繰り返し、配列の最大(または最小)値が配列の最後に移動する。
これを配列の長さだけ繰り返すことで、配列全体がソートされる。
バブルソートによる配列の並び替え
一方、クイックソートはバブルソートと比較すると非常に効率的なソートアルゴリズムである。 ピボットと呼ばれる要素を選んで、ピボットより小さい要素と大きい要素に分割する。 これを再帰的に繰り返すことで、配列全体がソートされる。コードとしては、下記通りになる。
クイックソートによる配列の並び替え
以上がバブルソートとクイックソートの基本的な実装だ。 他にも様々なソートアルゴリズム(マージソート、ヒープソート、挿入ソートなど)があり、それぞれ有効な場面がある。 それらのアルゴリズムを理解し、適切な状況で適切なソートアルゴリズムを選択しよう。
3. 配列と連想配列を使ったアルゴリズムの最適化
配列と連想配列は、データの管理とアルゴリズムの最適化において非常に強力なツールである。 以下にその一例を紹介する。 配列を用いてデータを探索する際、最悪のケースでは配列のすべての要素を探索(線形探索)する必要がある。 下記のようにユーザーデータに対して、for文で全てを調べていく方法だ。
通常のデータ探索
しかし、連想配列(ハッシュマップ)を使用すると、キーによる直接アクセスが可能となり、データの探索を大幅に高速化できる。 つまり、連想配列を用いることで、データの管理とアルゴリズムの最適化が図りやすくなるということだ。 先ほどの例では、ユーザーのIDをキーにしてユーザーデータを探す場合、配列では全ユーザーを探索する必要があった。 しかしながら、連想配列を使用すると、下記のコードでは一瞬でユーザーを見つけることができる。 このような例では、ぜひ連想配列を活用したい。
ハッシュマップを用いた探索の最適化
ところで、配列や連想配列は、計算結果を保存して再利用する「メモ化」のためにも使用できる。 これは再帰的な計算や、同じ引数で何度も呼び出される高コストな関数に対して有効だ。 例えば、フィボナッチ数列を計算する関数は、メモ化を利用することで大幅に高速化できる。
メモ化による高速化
以上のように、配列や連想配列を適切に使用することで、アルゴリズムの計算効率を大幅に向上させることが可能になる。
4. まとめ
今回は実践的な配列、連想配列の操作方法、計算方法について説明した。 他にも様々なアルゴリズムを用いて、難しい処理をしたり、効率よく計算することが求められるだろう。 しかしながら、データ構造として、配列と連想配列がベースとなるのは間違いない。 まずは、前話までに説明した基礎的な内容を理解した上で、実践的なコーディングに取り組むと良いだろう。
▼参考図書、サイト
JavaScriptでサーチ・ソートアルゴリズムを学ぶ Zenn
【アルゴリズム】JavaScriptでフィボナッチ数列問題を解く qiita