【TypeScript】Map・Set に型を付ける方法｜ジェネリクスでキー・値の型を指定する

// キーが string、値が number の Map
const scores = new Map<string, number>();

scores.set('alice', 80);
scores.set('bob', 92);

// error TS2345: Argument of type 'string' is not assignable to parameter of type 'number'.
scores.set('carol', '75');

// error TS2345: Argument of type 'number' is not assignable to parameter of type 'string'.
scores.set(1, 100);

// 要素が string の Set
const tags = new Set<string>();

tags.add('typescript');

// error TS2345: Argument of type 'number' is not assignable to parameter of type 'string'.
tags.add(1);

type Status = 'draft' | 'published';

interface User {
  id: number;
  name: string;
}

// キーを Status に限定した Map
const labels = new Map<Status, string>([
  ['draft', '下書き'],
  ['published', '公開済み'],
]);

// error TS2345: Argument of type '"archived"' is not assignable to parameter of type 'Status'.
labels.set('archived', 'アーカイブ');

// 値にオブジェクトの型を指定することもできる
const users = new Map<number, User>();
users.set(1, { id: 1, name: 'Alice' });

const m = new Map();   // m: Map<any, any>

m.set('a', 1);
m.set(1, { x: 1 });    // キーも値もバラバラだがエラーにならない

const v = m.get('a');  // v: any
v.toFixed(2);          // 型としては通る。中身が数値でなければ実行時エラー

const s = new Set();   // s: Set<unknown>

s.add('a');
s.add(1);              // unknown なので追加は通る

for (const x of s) {
  // error TS18046: 'x' is of type 'unknown'.
  console.log(x.toUpperCase());
}

// 初期値から Map<string, number> と推論される
const scores = new Map([
  ['alice', 80],
  ['bob', 92],
]);

// 空配列だと Set<never> になり、何も追加できなくなる
const empty = new Set([]);
// error TS2345: Argument of type '"a"' is not assignable to parameter of type 'never'.
empty.add('a');

// 型引数を書けば意図どおり
const tags = new Set<string>();

// error TS2769: No overload matches this call.
//   Overload 2 of 4, '(entries?: readonly (readonly [string, number])[] | null | undefined):
//   Map<string, number>', gave the following error.
//     Type 'string' is not assignable to type 'number'.
const bad = new Map([
  ['retry', 3],
  ['mode', 'fast'],
]);

// 型引数でユニオン型を指定すれば通る
const config = new Map<string, number | string>([
  ['retry', 3],
  ['mode', 'fast'],
]);

// labels: Map<string, string>
const labels = new Map([
  ['draft', '下書き'],
  ['published', '公開済み'],
]);

// labelsConst: Map<'draft' | 'published', '下書き' | '公開済み'>
const labelsConst = new Map([
  ['draft', '下書き'],
  ['published', '公開済み'],
] as const);

// キーが限定されるので、知らないキーを渡すとエラーになる
// error TS2345: Argument of type '"archived"' is not assignable to
// parameter of type '"draft" | "published"'.
labelsConst.get('archived');

const scores = new Map<string, number>([['alice', 80]]);

const alice = scores.get('alice');   // alice: number | undefined

// error TS18048: 'alice' is possibly 'undefined'.
console.log(alice.toFixed(0));

if (scores.has('alice')) {
  // has() では絞り込まれない
  // error TS2322: Type 'number | undefined' is not assignable to type 'number'.
  const n: number = scores.get('alice');
}

const scores = new Map<string, number>([['alice', 80], ['bob', 92]]);

// 1. 変数に受けて絞り込む
const alice = scores.get('alice');
if (alice !== undefined) {
  console.log(alice.toFixed(0));   // ここでは number
}

// 2. 既定値を与える（?? なら 0 を潰さない）
const bob: number = scores.get('bob') ?? 0;

// 3. 必ずあるはずのキー用のヘルパー
function getOrThrow<K, V>(map: ReadonlyMap<K, V>, key: K): V {
  const value = map.get(key);
  if (value === undefined) {
    throw new Error(`key not found: ${String(key)}`);
  }
  return value;
}

const carol: number = getOrThrow(scores, 'alice');

const scores = new Map<string, number>([['alice', 80], ['bob', 92]]);

// name: string, score: number として推論される
for (const [name, score] of scores) {
  console.log(`${name}: ${score.toFixed(0)}`);
}

for (const name of scores.keys()) { /* name: string */ }
for (const score of scores.values()) { /* score: number */ }

// entries(): MapIterator<[string, number]>
for (const [name, score] of scores.entries()) { /* 上の for...of と同じ */ }

// forEach は (値, キー, map) の順。分割代入ではないので順番に注意
scores.forEach((score, name) => {
  console.log(name, score);
});

const scores = new Map<string, number>([['alice', 80], ['bob', 92]]);

const pairs = [...scores];              // [string, number][]
const same = Array.from(scores);        // [string, number][]
const names = [...scores.keys()];       // string[]

// 点数の高い順に並べ替える
const ranking = [...scores]
  .sort((a, b) => b[1] - a[1])
  .map(([name, score]) => `${name}(${score})`);   // string[]

// Array.from は第2引数で変換もできる
const labels = Array.from(scores, ([name, score]) => `${name}:${score}`);   // string[]

// 配列の重複排除は Set 経由が定番
const unique = [...new Set(['a', 'a', 'b'])];   // string[]

error TS2583: Cannot find name 'Map'. Do you need to change your target library?
Try changing the 'lib' compiler option to 'es2015' or later.

error TS2802: Type 'Map<string, number>' can only be iterated through when using
the '--downlevelIteration' flag or with a '--target' of 'es2015' or higher.

{
  "compilerOptions": {
    "strict": true,
    "target": "es2020",
    "lib": ["es2020", "dom"]
  }
}

function total(scores: ReadonlyMap<string, number>): number {
  let sum = 0;
  for (const score of scores.values()) {
    sum += score;
  }
  // error TS2339: Property 'set' does not exist on type 'ReadonlyMap<string, number>'.
  scores.set('x', 0);
  return sum;
}

const scores = new Map<string, number>([['alice', 80]]);
total(scores);   // Map はそのまま渡せる

type Status = 'draft' | 'published';

const STATUSES = new Set<Status>(['draft', 'published']);

declare const input: string;

// error TS2345: Argument of type 'string' is not assignable to parameter of type 'Status'.
STATUSES.has(input);

// ReadonlySet<string> として見れば任意の文字列を問い合わせられる
function isStatus(value: string): value is Status {
  return (STATUSES as ReadonlySet<string>).has(value);
}

if (isStatus(input)) {
  const status: Status = input;   // ここでは Status に絞り込まれている
}

type Status = 'draft' | 'published';

// キーが決まっている → Record（書き漏らすとエラーになる）
// error TS2741: Property 'published' is missing in type '{ draft: string; }'
// but required in type 'Record<Status, string>'.
const labels: Record<Status, string> = {
  draft: '下書き',
};

// 実行時に増減する → Map
const cache = new Map<number, { name: string }>();
cache.set(1, { name: 'Alice' });
cache.delete(1);

const labels: Record<Status, string> = { draft: '下書き', published: '公開済み' };

// Object.entries() は [string, string][] を返すので Map<string, string> になる
const loose = new Map(Object.entries(labels));

// キーの型を保ちたいときは明示する
const strict = new Map<Status, string>(
  Object.entries(labels) as [Status, string][],
);

// Map → オブジェクト（キーが string の Map のみ）
const obj = Object.fromEntries(strict);   // { [k: string]: string }

// Map をそのまま JSON にすると中身が消える
console.log(JSON.stringify(strict));                        // {}
console.log(JSON.stringify(Object.fromEntries(strict)));    // {"draft":"下書き",...}

interface Session {
  id: string;
}

// キーが Session、値が { visits: number }
const meta = new WeakMap<Session, { visits: number }>();

const session: Session = { id: 'abc' };
meta.set(session, { visits: 1 });

const visits = meta.get(session)?.visits;   // number | undefined

// キーはオブジェクトなので、文字列を渡すとエラーになる
// error TS2345: Argument of type 'string' is not assignable to parameter of type 'Session'.
meta.set('abc', { visits: 1 });

// そもそもキーの型引数にプリミティブ型を指定できない
// error TS2344: Type 'string' does not satisfy the constraint 'object'.
const ng = new WeakMap<string, number>();

// 既に見たオブジェクトを記録する用途
const seen = new WeakSet<Session>();
seen.add(session);
console.log(seen.has(session));   // true