TypeScript: Partial, Pick, Readonly型を使いこなす

TypeScriptで単一のプロパティをオプションにする

? 演算子を使用して、プロパティをオプションにすることができます。 これは、プロパティが null または undefined である可能性があることを示します。

interface Person {
  name: string;
  age?: number; // オプションのプロパティ
}

const person: Person = {
  name: "John Doe",
};

// age プロパティは存在しないため、null と評価されます
console.log(person.age); // null

Partial 型を使用して、既存の型のすべてのプロパティをオプションにすることができます。

interface Person {
  name: string;
  age: number;
}

const partialPerson: Partial<Person> = {
  name: "John Doe",
};

// age プロパティは存在しないため、null と評価されます
console.log(partialPerson.age); // null

interface Person {
  name: string;
  age: number;
  address: string;
}

const optionalPerson: Pick<Person, "name" | "age"> = {
  name: "John Doe",
  age: 30,
};

// address プロパティは存在しないため、エラーが発生します
console.log(optionalPerson.address); // エラーが発生します

デフォルト値を使用する

プロパティにデフォルト値を設定することで、そのプロパティをオプションにすることができます。

interface Person {
  name: string;
  age?: number; // デフォルト値は 0
}

const person: Person = {
  name: "John Doe",
};

// age プロパティは存在しないため、デフォルト値の 0 と評価されます
console.log(person.age); // 0

これらの方法のいずれを使用しても、TypeScriptで単一のプロパティをオプションにすることができます。 どの方法を使用するかは、特定の要件によって異なります。

// 1. `?` 演算子を使用する

interface Person {
  name: string;
  age?: number; // オプションのプロパティ
}

const person: Person = {
  name: "John Doe",
};

// age プロパティは存在しないため、null と評価されます
console.log(person.age); // null


// 2. `Partial` 型を使用する

interface Person {
  name: string;
  age: number;
}

const partialPerson: Partial<Person> = {
  name: "John Doe",
};

// age プロパティは存在しないため、null と評価されます
console.log(partialPerson.age); // null


// 3. `Pick` 型を使用する

interface Person {
  name: string;
  age: number;
  address: string;
}

const optionalPerson: Pick<Person, "name" | "age"> = {
  name: "John Doe",
  age: 30,
};

// address プロパティは存在しないため、エラーが発生します
console.log(optionalPerson.address); // エラーが発生します


// 4. デフォルト値を使用する

interface Person {
  name: string;
  age?: number; // デフォルト値は 0
}

const person: Person = {
  name: "John Doe",
};

// age プロパティは存在しないため、デフォルト値の 0 と評価されます
console.log(person.age); // 0

このサンプルコードを実行すると、以下の出力が得られます。

null
null
エラーが発生します
0

Readonly 型を使用して、プロパティを書き込み不可にすることができます。 これは、プロパティを初期化時にのみ設定できることを意味します。

interface Person {
  readonly name: string; // 書き込み不可のプロパティ
  age: number;
}

const person: Person = {
  name: "John Doe",
  age: 30,
};

// person.name = "Jane Doe"; // エラーが発生します

Union 型を使用して、プロパティの可能な値を制限することができます。

interface Person {
  name: string;
  age: number | undefined; // 数値または undefined
}

const person: Person = {
  name: "John Doe",
  age: 30,
};

// person.age = "30"; // エラーが発生します

インターフェースの拡張を使用する

既存のインターフェースを拡張して、単一のプロパティをオプションにすることができます。

interface Person {
  name: string;
}

interface OptionalPerson extends Person {
  age?: number; // オプションのプロパティ
}

const person: OptionalPerson = {
  name: "John Doe",
};

// age プロパティは存在しないため、null と評価されます
console.log(person.age); // null

これらの方法は、上記で説明した方法よりも特殊な場合に使用されます。 どの方法を使用するかは、特定の要件によって異なります。

• Readonly 型: プロパティを書き込み不可にする
• インターフェースの拡張: 既存のインターフェースを拡張して、単一のプロパティをオプションにする

これらの方法は、特定の要件に応じて使用できます。