TypeScript Academy · レッスン

デフォルト型パラメーター

引数が指定されない場合の代替型を用意します。

レッスン 4/413 ステップ

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

ようこそ

デフォルト型パラメーターは、呼び出し側が型引数を指定しない場合のフォールバック型を提供します。これにより、ジェネリックAPIがより使いやすくなります。

デフォルト構文

型パラメーター名の後に`= DefaultType`を追加して、デフォルトを設定します。
interface Container<T = string> {
  value: T;
}
const c: Container = { value: 'hello' }; // T defaults to string
const n: Container<number> = { value: 42 };

ジェネリック関数でのデフォルト

関数の型パラメーターにもデフォルトを指定できます。ただし、TypeScriptが通常は型を推論するため、使用頻度は高くありません。
function createList<T = string>(): T[] { return []; }
const list = createList(); // T is string by default

制約との組み合わせ

型パラメーターには、制約とデフォルトの両方を指定できます。デフォルトは制約を満たしていなければなりません。
interface Event<T extends object = Record<string, unknown>> {
  type: string;
  payload: T;
}

Reactのようなコンポーネントでのデフォルト

デフォルト型パラメーターは、コンポーネントのpropsに対するUIライブラリのジェネリクスでよく使われます。
interface SelectProps<T = string> {
  options: T[];
  value: T;
  onChange: (val: T) => void;
}

複数のデフォルト

複数の型パラメーターに、それぞれデフォルトを指定できます。
type Pair<A = string, B = number> = { first: A; second: B };
const p: Pair = { first: 'hello', second: 42 }; // A=string, B=number

後続の型パラメーターにもデフォルトが必要

後続の型パラメーターにデフォルトを使用する場合、デフォルトのない先行するパラメーターはすべて指定する必要があります。
type Map<K = string, V = unknown> = Record<K extends string ? K : string, V>;
const m: Map = {}; // K=string, V=unknown by default

TypeScriptがデフォルトを無視する場合

TypeScriptがコンテキストから型引数を推論できる場合は、デフォルトが指定されていても推論した型を使用します。
function wrap<T = string>(val: T): T { return val; }
const n = wrap(42); // T is number, not string (inferred)

明示的な上書き

型引数を明示的に指定すると、常にデフォルトが上書きされます。
interface Box<T = string> { item: T; }
const numBox: Box<number> = { item: 100 }; // T explicitly number

クラスジェネリクスでのデフォルト

ジェネリッククラスにもデフォルト型パラメーターを指定できます。
class Stack<T = unknown> {
  private items: T[] = [];
  push(item: T) { this.items.push(item); }
  pop(): T | undefined { return this.items.pop(); }
}

デフォルトでジェネリックライブラリが使いやすくなる

ライブラリの作成者はデフォルト型パラメーターを使用して、一般的なユースケースで呼び出し側が記述する定型コードを減らします。

確認問題

`interface Box`の場合、`const b: Box = { value: 99 }`における`.value`の型は何ですか?

まとめ

デフォルト型パラメーター(T = DefaultType)は、呼び出し側が型を指定しない場合のフォールバック型を提供します。インターフェース、クラス定義、ライブラリAPIで特に役立ち、呼び出し側が記述する定型コードを減らせます。
無料で開始

AI チューターと学ぶ TypeScript — 無料

ブラウザでリアルコードを書いて実行し、24/7 の AI チューターから瞬時にサポートを受け、ウェブまたはアプリで続きから学習できます。

コース
101
レッスン
352

よくある質問

「デフォルト型パラメーター」レッスンは無料ですか?

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

「デフォルト型パラメーター」で何を学びますか?

引数が指定されない場合の代替型を用意します。 ブラウザで直接実行するハンズオンコードでTypeScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

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

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

「デフォルト型パラメーター」レッスンにはどのくらい時間がかかりますか?

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

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

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

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

  1. ジェネリック関数:型パラメーター
  2. ジェネリックInterfaceと型エイリアス
  3. extendsによるジェネリック制約
  4. デフォルト型パラメーター
← TypeScript Academyに戻る