オブジェクトとMapの違い

Posted at 2025-01-20

はじめに

Mapはオブジェクトと似たようにキーと値のペアを格納できますが、いくつかの重要な違いがあります。

オブジェクト: キーは文字列またはシンボルに限定されます。それ以外のデータ型は文字列に変換されます。
```
const obj = {};
obj[1] = 'one'; // 数値キーは文字列"1"に変換される
console.log(obj); // { '1': 'one' }
```

Map: 任意のデータ型をキーとして使用できます。

const map = new Map();
map.set(1, 'one'); // 数値キーそのまま使用可能
map.set({ key: 'value' }, 'object value');
console.log(map);

オブジェクト: 挿入順は保証されません。ただし、数値に見えるキーは数値順に並べられます。

const obj = { b: 'B', 2: 'two', a: 'A', 1: 'one' };
console.log(obj); // { '1': 'one', '2': 'two', b: 'B', a: 'A' }

Map: 挿入順が保持されます。

const map = new Map();
map.set('b', 'B').set(2, 'two').set('a', 'A').set(1, 'one');
console.log([...map.keys()]); // ['b', 2, 'a', 1]

オブジェクト: 直接イテレーションできません。Object.keys()やObject.entries()を使う必要があります。
```
const obj = { a: 1, b: 2 };
for (const key of Object.keys(obj)) {
  console.log(key, obj[key]);
}
```

Map: for...ofや.keys(), .values()などのメソッドで直接イテレーション可能です。

const map = new Map([['a', 1], ['b', 2]]);
for (const [key, value] of map) {
  console.log(key, value);
}

オブジェクト: サイズを取得するにはObject.keys(obj).lengthを使用します。
```
const obj = { a: 1, b: 2 };
console.log(Object.keys(obj).length); // 2
```

Map: sizeプロパティで簡単に取得できます。

const map = new Map([['a', 1], ['b', 2]]);
console.log(map.size); // 2

オブジェクト: 基本的な操作のみ（プロパティの追加、削除、存在確認）。
Map: 豊富なメソッドが用意されています。
- .set(key, value) - キーと値の追加または更新
- .get(key) - キーに対応する値を取得
- .has(key) - キーの存在確認
- .delete(key) - キーと値の削除
- .clear() - 全エントリーの削除

オブジェクト: Object.prototypeを継承するため、toStringやhasOwnPropertyといったメソッドが衝突する可能性があります。
```
const obj = {};
console.log(obj.toString); // [Function: toString]
```

Map: プロトタイプの衝突がなく、キーや値が純粋に管理されます。

const map = new Map();
console.log(map.toString); // [Function: toString] from Map prototype

Object:
シンプルな構造で、文字列のキーだけで十分な場合に最適です。
例: エンティティの表現、設定オブジェクト、またはJSON形式のデータ。
Map:
以下のような複雑なユースケースに適しています：
- キーに任意の型を使用できる必要がある場合。
- 挿入順序を保持することが重要な場合。
- 頻繁な追加・削除が必要で、パフォーマンスが重要な場合。
  例: キャッシュ、非文字列キーを使った検索処理。