TypeScriptでのデフォルト引数の型定義方法を徹底解説

TypeScriptにおいて、関数のデフォルト引数はコードの柔軟性と保守性を高めるために頻繁に利用されます。デフォルト引数を使うことで、関数の呼び出し時に引数を省略でき、開発者がより簡潔なコードを書くことが可能です。しかし、特に型定義を行うTypeScriptでは、デフォルト引数の型推論や明示的な型指定に注意が必要です。本記事では、TypeScriptでのデフォルト引数の型定義方法を詳しく解説し、開発者が効率的に関数を定義・利用するための実践的な知識を提供します。

デフォルト引数の基本概念

デフォルト引数とは、関数の引数にあらかじめ値を設定しておき、その引数が関数呼び出し時に省略された場合でも、指定されたデフォルト値が適用される仕組みです。これにより、関数の呼び出しが柔軟になり、引数の多様な組み合わせに対応できます。

例えば、以下の例ではbにはデフォルトで10が設定されています。この場合、bを省略した場合でも関数はエラーなく動作します。

function sum(a: number, b: number = 10): number {
    return a + b;
}

console.log(sum(5)); // 出力は15 (a = 5, b = 10)

このように、デフォルト引数はコードの簡潔化や、関数の柔軟性を高めるために非常に有用です。次に、このデフォルト引数の型推論について詳しく見ていきます。

TypeScriptでのデフォルト引数の型推論

TypeScriptでは、デフォルト引数が設定された場合、その引数の型は自動的にデフォルト値から推論されます。つまり、デフォルト値に基づいてTypeScriptが適切な型を推定してくれるため、明示的に型を定義しなくても、型安全なコードを記述することができます。

例えば、次のコードを見てみましょう。

function greet(name: string = "Guest"): string {
    return `Hello, ${name}`;
}

console.log(greet()); // 出力は "Hello, Guest"

この場合、name引数はデフォルトで"Guest"という文字列が指定されているため、TypeScriptは自動的にnameの型をstringとして推論します。この型推論のおかげで、開発者は煩雑な型定義を省略でき、シンプルなコードを維持できます。

ただし、推論された型が期待するものと異なる場合や、明示的に型を指定する必要がある場合には、手動で型を定義することもできます。次の章では、デフォルト引数に明示的な型定義が必要なケースについて詳しく解説します。

明示的な型定義の必要性

TypeScriptでは、デフォルト引数の型を推論できますが、すべての場合で型推論に頼るのが最適とは限りません。特に、関数のデフォルト引数に複数の型を許可する場合や、型の一貫性を確保するために明示的に型を定義することが重要です。

以下は明示的な型定義が必要となるケースの例です。

function calculateDiscount(price: number, discount: number = 0.05): number {
    return price - (price * discount);
}

この関数ではdiscountにデフォルトで0.05（5%）が設定されています。この場合、discountの型はnumberと推論されます。しかし、もしデフォルト値をnullやundefinedにして、後で別の値を入れる設計にしたい場合、明示的な型定義が必要です。

function calculateDiscount(price: number, discount: number | null = null): number {
    if (discount === null) {
        discount = 0.05; // デフォルト値を手動で設定
    }
    return price - (price * discount);
}

このように、型をnumber | nullとして明示的に定義することで、nullを引数として受け取ることが可能になり、デフォルト値がない場合でも柔軟に処理できるようになります。

明示的な型定義が必要となるケース:

• 複数の型を持つ引数（ユニオン型）
• nullやundefinedを初期値として使う場合
• 複雑な型や関数のドキュメント性を高めたい場合

明示的な型定義により、予期しない型エラーを防ぎ、コードの読みやすさと保守性を向上させることができます。次に、デフォルト引数とオプショナル引数の違いについて詳しく説明します。

デフォルト引数とオプショナル引数の違い

TypeScriptでは、デフォルト引数とオプショナル引数の両方を使用して関数の引数を柔軟に設定できますが、この二つには重要な違いがあります。適切に使い分けることで、より効果的なコードを書くことができます。

デフォルト引数とは

デフォルト引数は、関数が呼び出された際に引数が渡されなかった場合でも、あらかじめ指定された値が使用される仕組みです。たとえば、次のコードではbが省略された場合、自動的に10が使用されます。

function multiply(a: number, b: number = 10): number {
    return a * b;
}

console.log(multiply(5)); // 出力は50 (a = 5, b = 10)

この場合、引数が指定されなくても関数は常に動作します。デフォルト引数が使われるのは、このように引数にデフォルト値を与えたい場合です。

オプショナル引数とは

オプショナル引数は、その名の通り「任意」の引数であり、渡されるかどうかは関数の呼び出し時次第です。オプショナル引数は「?」を使って定義され、渡されなかった場合にはundefinedが適用されます。次の例では、bがオプショナル引数になっています。

function multiply(a: number, b?: number): number {
    if (b === undefined) {
        b = 10; // 値が渡されない場合の処理
    }
    return a * b;
}

console.log(multiply(5)); // 出力は50 (a = 5, b = 10)

この例では、bが省略された場合undefinedとなり、その後10が手動で設定されます。

デフォルト引数とオプショナル引数の違い

• デフォルト引数は、引数が省略された場合に自動的に設定される値を持ちます。関数内で何も処理を追加しなくても、デフォルト値が適用されます。
• オプショナル引数は引数を渡さないことが許容されますが、渡されなかった場合はundefinedが適用され、関数内でundefinedを処理する必要があります。

これらの違いを理解することで、特定のケースに応じて最適な引数の定義方法を選択でき、コードの保守性や効率性を向上させることが可能です。次は、デフォルト引数に関連する型エラーの防止方法を見ていきます。

デフォルト引数の型エラーの防止方法

デフォルト引数を使用する際に、意図しない型エラーが発生することがあります。これは、デフォルト引数の型と関数の他の部分との整合性が取れていない場合や、異なる型の値が引数として渡された場合に起こり得ます。ここでは、デフォルト引数に関連する一般的な型エラーのパターンと、それらを防止する方法について解説します。

エラーの原因: 型の不整合

デフォルト引数が設定されている場合、TypeScriptはそのデフォルト値に基づいて型推論を行います。しかし、明示的に型定義を行わずに異なる型の引数を渡した場合、型エラーが発生します。

function formatMessage(message: string = "Hello", count: number = 1): string {
    return `${message} - Count: ${count}`;
}

console.log(formatMessage(100)); // エラー: 'number'型の引数は'number | string'には割り当てられません

この例では、message引数にnumber型の値を渡そうとして型エラーが発生しています。このようなエラーを防ぐためには、関数に渡す引数の型を正しく指定することが重要です。

解決策: 明示的な型定義

デフォルト引数に対して明示的に型を定義することで、異なる型が渡された場合でもエラーを明確に示すことができます。デフォルト値に基づく型推論だけではなく、期待する型を正確に指定することがベストプラクティスです。

function formatMessage(message: string = "Hello", count: number = 1): string {
    return `${message} - Count: ${count}`;
}

この場合、messageには常にstring型が期待されるため、誤った型の値を渡すことができません。

エラーの原因: ユニオン型とデフォルト引数

デフォルト引数にユニオン型（複数の型を受け入れる型）を使用する場合、意図しない型エラーが発生する可能性があります。例えば、以下の例ではnumber | null型を使用していますが、適切にハンドリングしないとエラーになります。

function calculateTotal(price: number, discount: number | null = null): number {
    if (discount === null) {
        discount = 0.1;
    }
    return price - (price * discount);
}

このようなケースでは、discountがnullの場合の処理を関数内で明示的に行う必要があります。これにより、型エラーの防止が可能です。

解決策: デフォルト値の条件付き設定

デフォルト引数がnullやundefinedの場合は、関数内で条件付きでデフォルト値を設定することが推奨されます。これにより、型エラーを回避しつつ、より柔軟な関数を作成できます。

function calculateTotal(price: number, discount: number | null = null): number {
    discount = discount ?? 0.1; // discountがnullまたはundefinedの場合、0.1を設定
    return price - (price * discount);
}

このように、条件付きでデフォルト値を設定することで、意図しないエラーを防ぎつつ、柔軟で堅牢なコードを書くことができます。

次に、関数オーバーロードとデフォルト引数を組み合わせた場合の注意点について解説します。

関数オーバーロードとデフォルト引数

TypeScriptでは、関数オーバーロードとデフォルト引数を組み合わせて使うことができますが、その際にはいくつか注意点があります。関数オーバーロードとは、同じ関数名で異なる引数のパターンを定義し、さまざまなシナリオに対応する方法です。しかし、デフォルト引数を持つ関数をオーバーロードする場合、意図した動作が得られない場合があるため、慎重な設計が必要です。

オーバーロードとデフォルト引数の基本

TypeScriptでは、関数のオーバーロードを使用することで、異なる型や引数のパターンをサポートすることができます。例えば、次のように同じ関数名で異なるシグネチャを持つ関数を定義できます。

function greet(name: string): string;
function greet(): string;
function greet(name?: string): string {
    if (name) {
        return `Hello, ${name}`;
    } else {
        return "Hello, Guest";
    }
}

この例では、greet関数は引数なし、またはstring型の引数を受け取ることができます。引数が渡されなかった場合にはデフォルトで"Guest"を出力します。

オーバーロード時のデフォルト引数の注意点

関数オーバーロードとデフォルト引数を同時に使用する場合、デフォルト引数は最後の関数実装にのみ適用されます。つまり、オーバーロードシグネチャにはデフォルト引数を含めることができず、デフォルト引数の効果は関数実装部分にのみ存在します。

次の例を見てみましょう。

function calculateTotal(price: number, discount: number): number;
function calculateTotal(price: number): number;
function calculateTotal(price: number, discount: number = 0.1): number {
    return price - (price * discount);
}

この場合、calculateTotal関数はpriceだけを渡す場合や、priceとdiscountの両方を渡す場合に呼び出すことが可能です。しかし、デフォルト引数のdiscount = 0.1は、最後の実装部分にのみ反映されます。

問題点: 意図しない動作

デフォルト引数と関数オーバーロードを組み合わせる際には、引数の組み合わせによって意図しない挙動が発生する可能性があります。例えば、オーバーロードのシグネチャとデフォルト引数の間で矛盾が生じることがあります。

function calculateTotal(price: number, discount?: number): number {
    if (discount === undefined) {
        discount = 0.05; // デフォルト値を設定
    }
    return price - (price * discount);
}

この場合、オーバーロードが引数discountを省略可能としていますが、同時にデフォルト値も設定されています。これは混乱を招く可能性があるため、明確にデフォルト値とオーバーロードの設計を分けて考える必要があります。

ベストプラクティス: 明確なシグネチャとデフォルト引数の分離

デフォルト引数を使用する場合、オーバーロードを過度に複雑にせず、シンプルなシグネチャを維持することが重要です。デフォルト引数を使う場合、基本的にはオーバーロードを避け、シンプルな構造でコードを保つことが推奨されます。

次の例では、デフォルト引数を使いつつも明確でシンプルなシグネチャを維持しています。

function calculateTotal(price: number, discount: number = 0.1): number {
    return price - (price * discount);
}

このように、デフォルト引数を利用する場合には、オーバーロードを使う必要がないシンプルなケースにまとめると、コードがわかりやすく、予期しない動作を避けることができます。

次は、実践的な例としてデフォルト引数を使った関数の型定義を見ていきます。

実践的な例: デフォルト引数の型定義

ここでは、デフォルト引数を用いた具体的な関数の型定義について、実践的な例を示して解説します。デフォルト引数を正しく定義し活用することで、関数の柔軟性と保守性を向上させることができます。

例1: デフォルト引数でのシンプルな関数定義

次の例は、シンプルなデフォルト引数を使った関数の型定義です。引数greetingにデフォルト値を設定することで、引数を省略してもエラーが発生しない関数を作成しています。

function greet(name: string, greeting: string = "Hello"): string {
    return `${greeting}, ${name}!`;
}

console.log(greet("Alice")); // 出力: "Hello, Alice!"
console.log(greet("Bob", "Hi")); // 出力: "Hi, Bob!"

この関数は、nameとgreetingの2つの引数を受け取りますが、greetingにはデフォルト値"Hello"が設定されています。そのため、greetingを省略した場合でも、"Hello"が適用されます。こうすることで、関数呼び出し時のオプションが増え、コードがより柔軟になります。

例2: ユニオン型を使った複数の型のサポート

次の例では、デフォルト引数を利用しつつ、ユニオン型を使って複数の型をサポートする関数を定義しています。ここでは、discountが数値であれば割引率として、文字列の場合はクーポンコードとして扱われます。

function applyDiscount(price: number, discount: number | string = 0): number {
    if (typeof discount === "number") {
        return price - (price * discount);
    } else if (typeof discount === "string") {
        // クーポンコードによる割引を処理する例
        if (discount === "SAVE10") {
            return price - 10;
        }
    }
    return price;
}

console.log(applyDiscount(100)); // 出力: 100 (デフォルト値0を適用)
console.log(applyDiscount(100, 0.1)); // 出力: 90 (10%の割引)
console.log(applyDiscount(100, "SAVE10")); // 出力: 90 (クーポンコードによる割引)

この例では、discountが数値または文字列のいずれかである場合に対応しています。デフォルト値として0が設定されていますが、渡される引数によって異なる処理が行われる柔軟な関数となっています。特に、クーポンコードのように文字列を使って割引を適用するケースは、現実的なユースケースの一つです。

例3: 複数のデフォルト引数を使った関数

次に、複数のデフォルト引数を持つ関数の例を示します。この例では、配送オプションや税率など、複数のデフォルト設定を持つ注文計算関数を定義しています。

function calculateTotal(price: number, taxRate: number = 0.1, shipping: number = 5): number {
    return price + (price * taxRate) + shipping;
}

console.log(calculateTotal(100)); // 出力: 115 (税10%と5の送料を適用)
console.log(calculateTotal(100, 0.08)); // 出力: 113 (税8%と5の送料を適用)
console.log(calculateTotal(100, 0.08, 10)); // 出力: 118 (税8%と10の送料を適用)

この関数では、税率と送料のデフォルト値が指定されています。引数をすべて省略する場合でも、デフォルト値を使用して正確な計算が行われます。こうした構造により、関数を呼び出す際の柔軟性が高まり、状況に応じて必要な引数のみを指定することができます。

実践的な活用

デフォルト引数は、関数のオプション性を高めるために非常に有用です。特に、デフォルト値を適切に設定することで、コードを呼び出すたびにすべての引数を指定する必要がなくなり、より簡潔で読みやすいコードを書くことができます。ユニオン型や複数のデフォルト引数を使うことで、さらに複雑なロジックをシンプルに管理することも可能です。

次は、デフォルト引数の型定義におけるベストプラクティスについて解説します。

デフォルト引数の型定義におけるベストプラクティス

デフォルト引数は便利な機能ですが、適切に使用しないと意図しない動作や型エラーを引き起こす可能性があります。ここでは、デフォルト引数の型定義に関するベストプラクティスをいくつか紹介し、効率的で堅牢なコードを記述するためのガイドラインを提供します。

1. デフォルト引数は最後に置く

TypeScriptでは、デフォルト引数を関数の最後に配置することが推奨されます。これは、引数が省略される場合、デフォルト引数が設定されていると、それ以降の引数も省略可能であるためです。以下の例は、引数の順序に注意する必要があることを示しています。

function createUser(name: string, age: number = 18, isActive: boolean = true): string {
    return `${name}, ${age}歳, 活動中: ${isActive}`;
}

console.log(createUser("Alice")); // 出力: Alice, 18歳, 活動中: true

このように、デフォルト引数を関数の最後に置くことで、引数が省略された場合でも想定通りの動作をします。

2. 型推論を活用する

TypeScriptの型推論機能を最大限に活用し、デフォルト値から適切に型を推論させることもベストプラクティスの一つです。明示的な型定義が不要な場合には、型推論に任せてコードを簡潔に保ちましょう。

function calculateTax(amount: number, rate = 0.1): number {
    return amount * rate;
}

この例では、rateの型はデフォルト値から自動的にnumberと推論されるため、明示的に型を定義する必要はありません。型推論を活用することで、コードの冗長性を減らし、保守性を高めることができます。

3. 明示的な型定義が必要な場合は正確に行う

複雑な型や、複数の型が存在する場合は、明示的に型を定義して意図を明確にすることが重要です。ユニオン型やオプショナル引数を使用する場合などは、必ず明確な型定義を行いましょう。

function applyDiscount(price: number, discount: number | null = null): number {
    if (discount === null) {
        discount = 0.05; // デフォルト割引率
    }
    return price - (price * discount);
}

この例では、discountがnullである場合にデフォルト値を設定し、複数の型に対応しています。ユニオン型や複雑な引数の定義が必要な場合でも、型エラーを避けるために明示的な型定義を行うことが大切です。

4. デフォルト引数とオプショナル引数の区別を明確にする

デフォルト引数とオプショナル引数は似ていますが、異なる用途を持ちます。デフォルト引数は値が省略された場合にあらかじめ定義された値が適用されるのに対し、オプショナル引数はundefinedが渡されることが前提です。それぞれの用途に応じて適切に選択することで、予期しない動作を防ぐことができます。

function greetUser(name: string, greeting?: string): string {
    return `${greeting ?? "Hello"}, ${name}!`;
}

console.log(greetUser("Bob")); // 出力: "Hello, Bob!"
console.log(greetUser("Bob", "Hi")); // 出力: "Hi, Bob!"

この例では、オプショナル引数greetingがundefinedの場合はデフォルトの挨拶が使用されます。オプショナル引数とデフォルト引数の違いを理解し、適切な引数定義を行うことが大切です。

5. シンプルでわかりやすいコードを心がける

デフォルト引数を使う際には、必要以上に複雑にせず、コードのシンプルさを維持することが重要です。デフォルト引数や型定義が過度に複雑になると、保守性が低下し、バグの温床となる可能性があります。コードが分かりやすく、意図が明確であることを常に意識しましょう。

function calculateFinalPrice(price: number, tax: number = 0.1, discount: number = 0): number {
    return price + (price * tax) - (price * discount);
}

この関数はシンプルでありながら、税金と割引を含む価格計算のロジックを効率的に処理しています。複雑な条件や不要なロジックを排除し、必要な処理だけを行うことで、コードを簡潔に保つことができます。

次は、デフォルト引数を用いたユーティリティ関数の応用例を見ていきましょう。

応用例: デフォルト引数を用いたユーティリティ関数

デフォルト引数を使うことで、汎用的で使い勝手の良いユーティリティ関数を作成できます。ここでは、デフォルト引数を活用したいくつかの高度なユーティリティ関数の応用例を紹介します。

例1: 配列の合計値を計算するユーティリティ関数

デフォルト引数を使って、オプションの係数を指定することで、配列内の数値の合計値を求める関数を作成できます。係数が指定されない場合、1として計算します。

function sumArray(arr: number[], multiplier: number = 1): number {
    return arr.reduce((acc, val) => acc + (val * multiplier), 0);
}

console.log(sumArray([1, 2, 3])); // 出力: 6 (デフォルトの係数1)
console.log(sumArray([1, 2, 3], 2)); // 出力: 12 (係数2を適用)

この関数は、配列の各要素にデフォルト値の係数を掛けて合計を計算します。これにより、関数の柔軟性が増し、さまざまな用途に適用できます。

例2: デフォルト引数を用いたオブジェクトのマージ

デフォルト引数を活用して、オブジェクトのプロパティをデフォルト値で補完しながらマージするユーティリティ関数を実装します。この関数は、指定された値がない場合にデフォルトの設定を使用します。

function mergeSettings(defaultSettings: object, userSettings: object = {}): object {
    return { ...defaultSettings, ...userSettings };
}

const defaultSettings = { theme: "light", showNotifications: true };
const userSettings = { theme: "dark" };

console.log(mergeSettings(defaultSettings)); 
// 出力: { theme: "light", showNotifications: true }

console.log(mergeSettings(defaultSettings, userSettings)); 
// 出力: { theme: "dark", showNotifications: true }

この例では、ユーザー設定が渡されなかった場合、デフォルト設定が使用され、渡された場合はそれらがマージされます。デフォルト引数とスプレッド構文を組み合わせて簡潔に記述できる点が特徴です。

例3: 再試行可能な関数を作成するユーティリティ

デフォルト引数を使って、再試行回数や遅延を指定できる関数を実装します。再試行が必要な処理や、外部リソースに依存する操作に応用できます。

async function retryOperation(operation: () => Promise<any>, retries: number = 3, delay: number = 1000): Promise<any> {
    for (let attempt = 1; attempt <= retries; attempt++) {
        try {
            return await operation();
        } catch (error) {
            if (attempt < retries) {
                console.log(`Retry ${attempt} failed. Retrying in ${delay}ms...`);
                await new Promise(res => setTimeout(res, delay));
            } else {
                throw new Error(`Operation failed after ${retries} attempts`);
            }
        }
    }
}

async function fetchData() {
    // 外部APIからデータを取得する処理（仮）
    throw new Error("Fetch failed");
}

retryOperation(fetchData).catch(console.error);

この関数は、指定した回数まで再試行し、再試行間の遅延をコントロールするためにデフォルト引数を使用します。retriesやdelayを省略してもデフォルト値が適用されるため、再利用性が高い関数となります。

例4: 関数の遅延実行をサポートするユーティリティ関数

デフォルト引数を使って、関数の実行を指定された時間だけ遅延させるユーティリティ関数を作成できます。遅延時間のデフォルト値は1000ミリ秒（1秒）です。

function delayExecution(fn: () => void, delay: number = 1000): void {
    setTimeout(fn, delay);
}

delayExecution(() => console.log("Executed after 1 second")); // デフォルトの1秒後に実行
delayExecution(() => console.log("Executed after 2 seconds"), 2000); // 2秒後に実行

このユーティリティ関数は、関数を指定した遅延時間後に実行します。デフォルトで1秒後に実行されるようになっているため、遅延時間を意識せずに簡単に関数の遅延実行が可能です。

応用のメリット

デフォルト引数を使用したユーティリティ関数は、関数の柔軟性を高め、さまざまな場面での再利用が可能です。また、デフォルト値を使うことで関数の使い勝手が向上し、コードが簡潔で読みやすくなります。特に、開発者がさまざまな引数パターンを考慮する必要がある場合、デフォルト引数はシンプルな設計を維持するのに役立ちます。

次は、デフォルト引数に関するよくある質問を解説し、さらなる理解を深めます。

デフォルト引数に関するよくある質問

デフォルト引数は、TypeScriptで非常に便利な機能ですが、その使い方や挙動に関して疑問が生じることがあります。ここでは、デフォルト引数に関するよくある質問を取り上げ、その解答を詳しく解説します。

質問1: デフォルト引数に`undefined`を渡した場合はどうなりますか？

デフォルト引数にundefinedを渡した場合、TypeScriptではその引数が渡されなかったとみなされ、デフォルト値が使用されます。これはnullとは異なり、undefinedが暗黙的にデフォルト値に置き換えられるためです。

function greet(name: string = "Guest"): string {
    return `Hello, ${name}`;
}

console.log(greet(undefined)); // 出力: "Hello, Guest"
console.log(greet(null)); // 出力: "Hello, null"（明示的にnullを渡した場合）

このように、undefinedを渡すとデフォルト値が適用されますが、nullを渡した場合はそのまま使用されます。

質問2: 関数の途中の引数にデフォルト値を設定することは可能ですか？

はい、関数の途中にある引数にもデフォルト値を設定することが可能です。ただし、デフォルト値を持つ引数の後に引数を定義する場合、それを省略しても呼び出し時に関数の意図が誤解される可能性があります。そのため、デフォルト引数はできるだけ最後に配置することが推奨されます。

function createUser(name: string, age: number = 30, country: string): string {
    return `${name}, ${age}歳, ${country}`;
}

console.log(createUser("Alice", undefined, "Japan")); // 出力: "Alice, 30歳, Japan"

この例では、ageにデフォルト値を設定し、undefinedを渡すことでデフォルト値が適用されています。

質問3: デフォルト引数は関数オーバーロードと併用できますか？

デフォルト引数は関数オーバーロードと併用できますが、注意が必要です。デフォルト引数は関数の実装にのみ適用されるため、オーバーロードシグネチャには含まれません。オーバーロードとデフォルト引数の組み合わせは慎重に設計する必要があります。

function displayPrice(price: number, currency?: string): string;
function displayPrice(price: number, currency: string = "USD"): string {
    return `${price} ${currency}`;
}

console.log(displayPrice(100)); // 出力: "100 USD"
console.log(displayPrice(100, "EUR")); // 出力: "100 EUR"

この例では、デフォルト値として"USD"を設定していますが、オーバーロードシグネチャでは省略されています。

質問4: デフォルト引数に関数を指定することは可能ですか？

デフォルト引数には関数を指定することも可能です。例えば、ランダムな値や動的に生成される値をデフォルト引数として設定する場合に便利です。

function generateId(): number {
    return Math.floor(Math.random() * 1000);
}

function createItem(name: string, id: number = generateId()): string {
    return `Item: ${name}, ID: ${id}`;
}

console.log(createItem("Table")); // 出力例: "Item: Table, ID: 123"

このように、デフォルト引数として関数を使用することで、動的な値をデフォルトとして設定できます。

質問5: 複数のデフォルト引数を持つ関数にすべての引数を渡す必要はありますか？

いいえ、複数のデフォルト引数を持つ関数では、必要な引数だけを指定することが可能です。デフォルト値が設定されている引数は省略可能です。

function createAccount(username: string, password: string = "defaultPass", role: string = "user"): string {
    return `${username}, ${password}, ${role}`;
}

console.log(createAccount("Alice")); // 出力: "Alice, defaultPass, user"
console.log(createAccount("Bob", "customPass")); // 出力: "Bob, customPass, user"

この例では、必要な引数のみを渡すことで、残りの引数にはデフォルト値が適用されます。

これらの質問に基づいて、デフォルト引数の挙動や使用に関する理解がさらに深まったはずです。次に、この記事全体の内容を簡潔にまとめます。

まとめ

本記事では、TypeScriptにおけるデフォルト引数の基本的な使い方から、型推論、明示的な型定義、オプショナル引数との違い、そしてベストプラクティスや応用例に至るまで、詳細に解説しました。デフォルト引数は、コードをより柔軟で簡潔にする強力なツールです。適切に使うことで、エラーを防ぎ、保守性の高いコードを作成できます。特に、関数の汎用性を高め、開発者が効率的にコーディングできるように設計するための重要な技術です。