JavaScriptで辞書（Map）を作成する方法｜自作クラスとES6のMap徹底解説

JavaScriptにおいて、辞書（キーと値のペアを管理するデータ構造）は非常に便利な機能です。本記事では、独自のMyMapクラスを実装する方法と、ES6で標準搭載されたMapクラスを使う方法の両方を解説します。

まずは、組み込みのMapクラスを隠してしまわないよう、名前に注意しながらMyMapクラスを作成していきます。このクラスには、追加したすべての値を管理するためのコンテナオブジェクトを持たせます。あわせて、マップの中身をコンソールに出力するdisplayメソッドも定義しておきましょう。

MyMapクラスの基本実装

class MyMap {
    constructor() {
        this.container = {};
    }
    display() {
        console.log(this.container);
    }
}

このように、コンストラクタ内で空のオブジェクトをコンテナとして初期化し、そこにキーと値を格納していくのが基本的な考え方です。

ES6のMapクラスで直接作成する

ES6以降では、標準のMapクラスを使えば、辞書を簡単に作成できます。初期化時にキーと値の配列を渡すことも可能です。

const map1 = new Map();
const map2 = new Map([
    ["key1", "value1"],
    ["key2", "value2"]
]);

map2のように初期値を渡すと、生成と同時に複数のエントリが登録されます。

キーが存在するかどうかを確認する

次に、指定したキーがすでに存在するかどうかを判定できるよう、hasKeyメソッドを定義します。このメソッドは、後述する要素の削除や新しい値の設定といった処理でも活用される重要な基盤となります。

自作クラスでの実装例

hasKey(key) {
    return key in this.container;
}

in演算子を使うことで、オブジェクト内にそのキーが存在するかどうかをシンプルに判定できます。

ES6のMapクラスの場合

標準のMapクラスでは、hasメソッドを使ってキーの存在確認が行えます。

const myMap = new Map([
    ["key1", "value1"],
    ["key2", "value2"]
]);
console.log(myMap.has("key1")); // true
console.log(myMap.has("key3")); // false

出力結果

上記のコードを実行すると、以下のような出力が得られます。

true
false

存在するキーに対してはtrue、存在しないキーに対してはfalseが返されることが確認できます。hasメソッドは真偽値を返すため、条件分岐などでも直感的に扱えるのが特徴です。