Kodokon kodokon.com

関数に型を付ける: パラメーター、戻り値、省略可能な引数

パラメーター、戻り値、省略可能なパラメーターに型を付けて、関数をより安全にしましょう。

9 分 · 3 問

このレッスンを Kodokon で開く

関数は再利用可能なミニプログラムです。パラメーター(入力)を受け取り、値(出力)を返すことができます。関数に型を付けるとは、各パラメーターの型を指定し、それから閉じかっこの後ろに書く戻り値の型を指定することです。

TYPESCRIPT
function greet(name: string): string {
  return "Hello " + name + "!";
}

const message = greet("Karim");
console.log(message); // "Hello Karim!"
入力: string。出力: string。

何も返さない関数もあります。メッセージを表示するなど、単に動作を実行するだけの関数です。その場合の戻り値の型は void で、これは「空」を意味する語です。その結果を値として使おうとすると、TypeScriptが警告します。

TYPESCRIPT
function logWelcome(name: string): void {
  console.log("Welcome, " + name + "!");
}

logWelcome("Fatou"); // prints, but returns nothing
void は戻り値がないことを示します。

インターフェースのプロパティと同じように、パラメーターも ?省略可能にできます。そうすれば、呼び出し側はそれを提供してもしなくてもよくなります。関数の内部では、それが欠けている場合を扱うことを忘れないでください。

TYPESCRIPT
function makeCoffee(size: string, sugar?: boolean) {
  if (sugar) {
    return "A " + size + " coffee with sugar.";
  }
  return "A " + size + " coffee without sugar.";
}

makeCoffee("large", true); // with sugar
makeCoffee("small");       // sugar is missing
sugar? は提供しても…しなくてもよい。
TYPESCRIPT
function repeat(word: string, times: number = 2) {
  return word.repeat(times);
}

console.log(repeat("ha"));    // "haha"
console.log(repeat("ha", 3)); // "hahaha"
変形: = 記号によるデフォルト値。

理解度チェック

このレッスンの要点をしっかり覚えているか確認しましょう。

  1. function greet(name: string): string において、2番目の string は何を指しますか。
    • name パラメーターの型
    • 関数が返す値の型
    • 関数の名前
  2. 関数が何も返さないことを示す型はどれですか。
    • null
    • empty
    • void
    • zero
  3. 省略可能なパラメーターは関数の中でどこに置かなければなりませんか。
    • 必須のパラメーターの後ろ
    • 必須のパラメーターの前
    • リストの中のどこでも