TypeScriptで初期値を設定するデフォルト引数をわかりやすく解説

この記事では、TypeScriptで初期値を設定するために使われるデフォルト引数の使い方について解説していきます。

この記事を読むことで、デフォルト引数についての概要、使い方メリットを知ることができます。

デフォルト引数とは

まず始めに、デフォルト引数とは何かについて説明します。

デフォルト引数とは 関数の引数に値が渡されなかった場合に、自動的に設定される値 のことを指します。
具体的には以下のようなコードです。

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

このコードでは name 引数に値が渡されない場合、World という文字列が自動的に設定されます。

このように関数の初期値を設定するのがデフォルト引数というわけですね。

TypeScriptでの関数の型定義方法、typeを用いた事前型定義、ジェネリクスまで一挙に解説！

次はデフォルト引数の使い方について詳し紹介します。

以下のコードでは、taxRate にデフォルト引数を設定しています。
そのため税率が指定されない場合、デフォルトとして 0.08 が使用されます。

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

メリットは何と言っても、引数を省略できることです。
これでコードをシンプルにすることができますね！

最後に、デフォルト引数のメリットについて深堀りしてみます。

デフォルト引数の最大のメリットは 関数の引数がオプショナルになることでコードの柔軟性が上がる ことです。

例えば、以下のようなコードの場合に活用できます。

function createProfile(name: string, email: string = "", phone: string = "") {
  // プロファイル作成ロジック
}

このコードでは email と phone がオプションであるため、必要に応じて省略することができます。

デフォルト引数を使うことで関数の使用が楽になり、可読性も向上します！

TypeScriptアロー関数の基本から応用までわかりやすく解説！短くシンプルなコードで効率アップ！

デフォルト引数は使いこなすと便利なTypeScriptの機能です。

コードをシンプルにし、開発効率を向上させる強力なツールですね！
この記事がデフォルト引数の理解と活用に役立てば幸いです。