型付き関数

関数は、JavaScript アプリケーションの基本的な構成要素です。 TypeScript では、入力引数と戻り値の両方に正確に注釈を付けることができるため、インターフェイスと関数呼び出しが非常に安全で自己文書化されます。

オプションのパラメータとデフォルトのパラメータ

JavaScript では、すべてのパラメーターはオプションであり、省略された場合はデフォルトで undefined になります。 TypeScript では、デフォルトで、宣言されたすべてのパラメーターが必須です。

ただし、疑問符 (?) を使用してオプションのパラメーターを定義したり、関数シグネチャで直接デフォルト値を指定したりできます。

1. オプションのパラメータ

オプションのパラメーターはすべての必須パラメーターの 後 に配置する必要があります。

function greetUser(name: string, title?: string): string {
  if (title) {
    return `Good morning ${title} ${name}`;
  }
  return `Hello ${name}`;
}

2. デフォルトパラメータ

デフォルト値を持つパラメータに値が指定されていない場合、TypeScript はその型を推測し、指定されたデフォルトを割り当てます。

function greetUserWithDefault(name: string, prefix: string = 'Hello'): string {
  return `${prefix} ${name}`;
}

残りのパラメータ (...args)

可変数の引数を受け入れたい場合は、rest 演算子を使用できます。 TypeScript では、これらのパラメーターは配列として入力する必要があります。

function sumAll(message: string, ...numbers: number[]): string {
  const total = numbers.reduce((sum, n) => sum + n, 0);
  return `${message} ${total}`;
}

関数の種類 (コールシグネチャ)

関数の型を個別に定義し、それを変数宣言またはコールバック引数で再利用できます。

// Define function type using type alias
type MathOperation = (a: number, b: number) => number;

const add: MathOperation = (x, y) => x + y;
const multiply: MathOperation = (x, y) => x * y;

このアプローチは、関数を引数として他の関数 (コールバック) に渡す場合に不可欠です。

自分で試してみてください

演習 1: オプションのパラメータ

演習 2: デフォルトのパラメータ

演習 3: 関数のシグネチャ

演習 4: コールバック関数