戻り値の型 'void'

CoddyのJavaScriptジャーニー「Introduction To TypeScript」セクションの一部。レッスン 24/73。

関数が何らかのアクションを実行するものの、意味のある値を何も返さない場合、その意図を明示的に示すために void 戻り値の型を使用します。

void型は、戻り値がないことを表します。メッセージのログ出力、変数の更新、または副作用を実行する関数は、通常、戻り値の型としてvoidを使用します。

function logMessage(message: string): void {
  console.log(message);
}

function updateCounter(): void {
  counter++;
}

TypeScriptは関数がvoidを返すと推論できることが多いですが、: voidアノテーションを明示的に追加することで、コードの可読性が高まり、他の開発者に意図を明確に伝えることができます。

チャレンジ

簡単

string 型のパラメータ userName を受け取り、明示的な戻り値の型が void である displayWelcome という名前の関数を作成してください。この関数は、"Welcome to our application, [userName]!" という形式でコンソールにウェルカムメッセージを出力する必要があります。

string 型のパラメータ errorMessage を受け取り、明示的な戻り値の型が void である logError という名前の別の関数を作成してください。この関数は、"ERROR: [errorMessage]" という形式でコンソールにエラーメッセージを出力する必要があります。

パラメータを受け取らず、明示的な戻り値の型が void である processData という名前の3つ目の関数を作成してください。この関数は、コンソールに "Processing data..." というメッセージを出力し、次に新しい行に "Data processing complete." と出力する必要があります。

以下の順序で関数を呼び出して、関数をテストしてください：

"Alice" を渡して displayWelcome を呼び出す
引数なしで processData を呼び出す
"Invalid input detected" を渡して logError を呼び出す
"Bob" を渡して displayWelcome を呼び出す

各関数の呼び出しは、上記の指定された順序で、別々の行に出力される必要があります。

自分で試してみよう

// TODO: ここにコードを書いてください
// userName (string) を受け取り、void を返す displayWelcome 関数を作成します
// errorMessage (string) を受け取り、void を返す logError 関数を作成します  
// パラメータを受け取らず、void を返す processData 関数を作成します

// TODO: 指定された順序で関数を呼び出します:
// 1. "Alice" を引数に指定して displayWelcome を呼び出す
// 2. 引数なしで processData を呼び出す
// 3. "Invalid input detected" を引数に指定して logError を呼び出す
// 4. "Bob" を引数に指定して displayWelcome を呼び出す