【5分でわかる】Mapの使い方 | TypeScript入門

この記事ではTypeScriptにおけるMapの使い方をご紹介します。

Mapの使い方

Mapに値を追加する
Mapの値を取得する
Mapの値を削除する
Mapの値の存在チェック
Mapに設定された値の個数を取得する
Mapの値を全て削除する
Mapのkeyを全て取得する
Mapのkey,valueを全て取得する

TypeScriptにおけるMapを理解しよう!

Mapの使い方

TypeScriptでMapを使うにはkeyと,valueを設定してオブジェクトを生成します。

具体的には以下のように書きます

const map = new Map<string, number>();
map.set("test", 5);
console.log(map.get("test")); // 5

Mapに値を追加する

Mapに値を追加する場合は、set()メソッドを使います。

既に同じkeyが存在していた場合は、値を上書いてしまうので注意が必要です。

const map = new Map<string, number>();

map.set("test", 1);
console.log(map.get("test")); // 1

map.set("test", 2);
console.log(map.get("test")); // 2

Mapの値を取得する

Mapに値を取得する場合は、get()メソッドを使います。

const map = new Map<string, number>();

map.set("test", 1);
console.log(map.get("test")); // 1

存在しないキーに対して、get()メソッドを使用した場合は`undefined`が返却されますので注意してください。

Mapの値を削除する

Mapに値を削除する場合は、delete()メソッドを使います。

const map = new Map<string, number>();

map.set("testA", 1);
map.set("testB", 2);
map.delete("testA");

Mapの値の存在チェック

Mapに値が存在するかチェックしたい場合は、has()メソッドを使います。

以下のように確認したいkeyを設定すれば,true/falseで結果が返却されます。

const map = new Map<string, number>();
map.set("testA", 1);
console.log(map.has("testA")); //true

TypeScriptではhas()メソッドを使ってからget()メソッド使うことはできません。

なので以下のようにget()メソッド取得した際に`undefined`でないことを確認する方法が有効です。

const map = new Map<string, number>();
map.set("testA", 1);
const n = map.get("testA");
if (typeof n === "number") { // ここで型チェック
  n * 2;
}

Mapに設定された値の個数を取得する

Mapの値の個数をチェックしたい場合は、size()メソッドを使います。

const map = new Map<string, number>();

map.set("testA", 1);
map.set("testB", 2);
console.log(map.size); // 2

Mapの値を全て削除する

Mapに設定された値を全て削除したい場合は、clear()メソッドを使います。

const map = new Map<string, number>();

map.set("testA", 1);
map.set("testB", 2);
console.log(map.size); // 2

map.clear();
console.log(map.size); // 0

Mapのkeyを全て取得する

Mapのkeyのみを全て取得したい場合は、keysメソッドを使用します。

const map = new Map<string, number>();

map.set("testA", 1);
map.set("testB", 2);

const keys = [...map.keys()];
console.log(keys); // ["testA","testB"]

Mapのkey,valueを全て取得する

Mapのkeyとvalueを全てリスト形式で取得したい場合は、entriesメソッドを使用します。

const map = new Map<string, number>();

map.set("testA", 1);
map.set("testB", 2);

const keyValues = [...map.entries()];
console.log(keyValues); // [["testA", 1],["testB", 2]]