プログラミング

JavaScriptのMapとSet解説

Last Updated: 26/03/2025
28 1 minute read

JavaScriptには、データ構造として「Map（マップ）」と「Set（セット）」という2つの非常に便利なコレクション型が存在します。これらの型は、特にオブジェクトや配列に比べて特定のシナリオでの操作性や効率性が優れています。本記事では、MapとSetについてそれぞれの特徴、使い方、そして利点に焦点を当て、実際にどのように活用できるのかを詳しく解説します。

Related Articles

1. Map（マップ）とは？

Mapは、キーと値のペアを格納するコレクションです。キーは一意であり、任意のデータ型を使用できます。Mapを使用すると、キーに対する値の検索、追加、削除が効率的に行えます。

1.1. Mapの基本的な使い方

Mapの作成方法は簡単です。以下のコードは、Mapオブジェクトを作成し、データを格納する基本的な方法を示しています。

javascript
let map = new Map();

// データの追加
map.set("name", "Alice");
map.set("age", 30);

// データの取得
console.log(map.get("name"));  // "Alice"

// キーの存在確認
console.log(map.has("age"));  // true

// データの削除
map.delete("age");

// データのサイズ確認
console.log(map.size);  // 1

// すべてのデータの削除
map.clear();

1.2. Mapの特徴

  • キーに任意のデータ型を使用できる：通常のオブジェクトでは文字列やシンボル以外のデータ型をキーとして使うことができませんが、Mapでは関数やオブジェクト、配列などもキーとして使用できます。

  • 挿入順序の保持：Mapは挿入された順序を保持します。これはオブジェクトでは保証されない動作です。

  • イテレータのサポート：MapはforEachメソッドやfor...ofループを使用して、簡単に要素をイテレーションできます。

javascript
map.set("fruit", "apple");
map.set("color", "red");

for (let [key, value] of map) {
  console.log(`${key}: ${value}`);
}
// 出力:
// fruit: apple
// color: red

1.3. Mapの利点

  • 高速な検索：Mapは、オブジェクトに比べてキーの検索が非常に効率的です。特にキーが多くなると、その違いが顕著になります。

  • 値の削除とサイズ管理：Mapでは、特定のキーを削除したり、全てのキーをクリアする操作が容易です。また、サイズの取得もsizeプロパティで簡単に行えます。

2. Set（セット）とは？

Setは、重複しない値のコレクションです。値は一意でなければならず、同じ値を複数回追加することはできません。Setは、主にユニークなデータを保持するために使用されます。

2.1. Setの基本的な使い方

Setを使って重複しないデータを管理する方法は以下の通りです。

javascript
let set = new Set();

// データの追加
set.add(1);
set.add(2);
set.add(3);

// データの確認
console.log(set.has(2));  // true

// データの削除
set.delete(3);

// データのサイズ確認
console.log(set.size);  // 2

// すべてのデータの削除
set.clear();

2.2. Setの特徴

  • 重複を許さない：Setでは、同じ値を2回追加することはできません。これにより、データの一意性が保証されます。

  • 挿入順序の保持：SetもMapと同様に、挿入された順番を保持します。

  • イテレータのサポート：SetもforEachメソッドやfor...ofループを使用して簡単にイテレーションできます。

javascript
set.add(10);
set.add(20);
set.add(30);

for (let value of set) {
  console.log(value);
}
// 出力:
// 10
// 20
// 30

2.3. Setの利点

  • ユニークなデータの管理：Setは、重複データの管理が簡単です。例えば、配列から重複する要素を取り除く場合に便利です。

  • 高速な操作：Setでは、値の追加、削除、存在確認が高速です。特に大きなデータセットでの操作では、そのパフォーマンスの差が際立ちます。

3. MapとSetの使い分け

MapとSetは似ている部分もありますが、それぞれに異なる目的があります。Mapはキーと値のペアを格納し、Setは一意な値の集合を格納します。

  • Mapを使用する場面：キーと対応する値を管理したい場合に使用します。例えば、ユーザーのIDと名前のペアを保存するようなシナリオです。

  • Setを使用する場面：重複を排除したい場合に使用します。例えば、リスト内でユニークなアイテムだけを保持したい場合に便利です。

3.1. Mapの例：ユーザー情報の管理

javascript
let users = new Map();
users.set(1, { name: "Alice", age: 25 });
users.set(2, { name: "Bob", age: 30 });

console.log(users.get(1).name);  // "Alice"

3.2. Setの例：ユニークなアイテムの管理

javascript
let numbers = new Set([1, 2, 2, 3, 4, 4, 5]);
console.log([...numbers]);  // [1, 2, 3, 4, 5]

4. まとめ

MapとSetは、どちらもJavaScriptのコレクション型として非常に有用であり、特定の用途において非常に効率的に機能します。Mapは、キーと値のペアを管理するために最適で、Setは一意な値を管理するために役立ちます。これらのデータ構造を理解し、適切に使い分けることで、より効率的なコードを書くことができるようになります。

Last Updated: 26/03/2025
28 1 minute read
Back to top button