extendsによるジェネリック制約

ようこそ

制約がない場合の問題

function getLength<T>(val: T): number {
  // return val.length; // Error — T might not have .length
}

制約の追加

function getLength<T extends { length: number }>(val: T): number {
  return val.length;
}
getLength('hello');  // OK — string has .length
getLength([1, 2]);   // OK — array has .length
// getLength(42);   // Error — number has no .length

インターフェースへの制約

interface Named { name: string; }
function greet<T extends Named>(person: T): string {
  return 'Hello, ' + person.name;
}

keyof制約

function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}
const age = getProperty({ name: 'Alice', age: 30 }, 'age'); // number

ユニオンへの制約

type Status = 'active' | 'inactive' | 'banned';
function setStatus<T extends Status>(status: T): void {
  console.log('Setting status:', status);
}

コンストラクターへの制約

function create<T>(ctor: new () => T): T {
  return new ctor();
}

交差型による複数の制約

interface Serializable { serialize(): string; }
interface Loggable { log(): void; }
function process<T extends Serializable & Loggable>(item: T): void {
  item.log();
  console.log(item.serialize());
}

制約の継承

class Animal { breathe() { return 'breathing'; } }
function care<T extends Animal>(a: T): string { return a.breathe(); }

T自身の拡張（再帰）

interface Comparable<T> { compareTo(other: T): number; }
function max<T extends Comparable<T>>(a: T, b: T): T {
  return a.compareTo(b) >= 0 ? a : b;
}

制約エラーメッセージ

確認問題

まとめ