TypeScript Academy · レッスン

ユーティリティ型

Q: 「ユーティリティ型」で何を学びますか？

Partial、Readonlyなどのユーティリティ型を扱います ブラウザで直接実行するハンズオンコードでTypeScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

Partial、Readonlyなどのユーティリティ型を扱います

「ユーティリティ型」はCoddyKit上の無料TypeScript Academyレッスンです。これはレッスン3/4です。下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。これはTypeScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 TypeScript Academyコースには全4レッスンが含まれています。

ユーティリティ型入門

ユーティリティ型

次のレッスンへようこそ！このレッスンでは、型変換を簡単にして強化する TypeScript 組み込み機能、ユーティリティ型について学びます。さっそく始めましょう！

ユーティリティ型とは

ユーティリティ型は TypeScript が提供するあらかじめ定義された型で、プロパティをオプションや読み取り専用にしたり、型から特定のプロパティを選択したりするなど、一般的な型変換を実行します。

例：

type User = {
  name: string;
  age: number;
  email: string;
};

type PartialUser = Partial<User>;

let user: PartialUser = { name: "Alice" }; 
// Only 'name' is provided

Partial

Partial ユーティリティ型を使うと、ある型のすべてのプロパティをオプションにできます。例：

課題： Partial ユーティリティ型を使って型を作成し、それを使って変数を定義してください。

type User = {
  name: string;
  age: number;
};

type OptionalUser = Partial<User>;

let user: OptionalUser = { name: "Bob" }; 
// 'age' is optional

Readonly

Readonlyユーティリティ型は、型のすべてのプロパティを変更不可にします。例:

課題: Readonlyユーティリティ型を使用して、変更不可のオブジェクトを作成してください。

type User = {
  name: string;
  age: number;
};

type ReadonlyUser = Readonly<User>;

let user: ReadonlyUser = { name: "Alice", age: 25 };
// user.age = 30; 
// Error: Cannot assign to 'age' because it is a read-only property

Pick

Pickユーティリティ型は、型から特定のプロパティを選択します。例:

課題: Pickユーティリティ型を使用して、選択したプロパティだけを持つ型を作成してください。

type User = {
  name: string;
  age: number;
  email: string;
};

type UserNameAndEmail = Pick<User, "name" | "email">;

let user: UserNameAndEmail = { name: "Alice", email: "alice@example.com" };

Omit

Omitユーティリティ型は、型から特定のプロパティを除外します。例:

課題: Omitユーティリティ型を使用して、型からプロパティを除外してください。

type User = {
  name: string;
  age: number;
  email: string;
};

type UserWithoutEmail = Omit<User, "email">;

let user: UserWithoutEmail = { name: "Bob", age: 30 };

Record

Recordユーティリティ型は、キーの集合と、値に指定した型を持つ型を作成します。例:

課題: Recordユーティリティ型を使用して、キーと値の対応付けを作成してください。

type Role = "admin" | "user" | "guest";

type Permissions = Record<Role, string[]>;

let rolePermissions: Permissions = {
  admin: ["read", "write", "delete"],
  user: ["read", "write"],
  guest: ["read"],
};

Required

Requiredユーティリティ型は、型のすべてのプロパティを必須にします。例:

課題: Requiredユーティリティ型を使用して、すべてのプロパティを必須にしてください。

type User = {
  name?: string;
  age?: number;
};

type FullUser = Required<User>;

let user: FullUser = { name: "Alice", age: 30 }; 
// Both 'name' and 'age' are required

すばらしい出来です

おめでとうございます！TypeScriptの組み込みユーティリティ型について学習しました。Partial、Readonly、Pick、Omitなどのユーティリティ型を使うと、型をより簡単かつ効率的に扱えます。次のレッスンでは、高度なマップ型について詳しく学びます。引き続きコーディングしていきましょう！

よくある質問

「ユーティリティ型」レッスンは無料ですか？

はい。「ユーティリティ型」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、TypeScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 TypeScript Academyコースには全4レッスンが含まれています。

「ユーティリティ型」で何を学びますか？

Partial、Readonlyなどのユーティリティ型を扱いますブラウザで直接実行するハンズオンコードでTypeScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

TypeScript Academyを始めるのに経験は必要ですか？

事前経験は必要ありません。CoddyKitのTypeScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。これはレッスン3/4です。

「ユーティリティ型」レッスンにはどのくらい時間がかかりますか？

ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このTypeScript Academyレッスンでコードを書いて実行できますか？

はい。すべてのTypeScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

← TypeScript Academyに戻る