関数におけるvoid型
関数の戻り値の位置で、voidがundefinedとどのように異なるかを学びます。
「関数におけるvoid型」はCoddyKit上の無料TypeScript Academyレッスンです。 これはレッスン3/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはTypeScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 TypeScript Academyコースには全4レッスンが含まれています。
void の戻り値の型
voidは、有用な値を返さない関数を表します。関数の処理自体は完了しますが、利用すべき値を生成しません。副作用を目的に呼び出す関数の型です。
function log(message: string): void {
console.log(message);
}
log('Hello void');推論される void
関数にreturn文がない場合（または単独のreturn;しかない場合）、TypeScript は自動的にvoidを推論します。明示的に記述する必要はほとんどありませんが、意図を示す文書にはなります。
function greet(name: string) {
console.log('Hi ' + name);
// no return -> inferred void
}
greet('Ada');void と undefined の違い
関連していますが、同じではありません。void型の関数は実際にundefinedを返す場合もあれば返さない場合もあり、その戻り値に依存してはいけません。戻り値がundefined型の関数では、それを明示的に返す必要があります。
function a(): void { /* returns nothing useful */ }
function b(): undefined { return undefined; }
console.log(a(), b());void の結果は利用しない
実行時にはvoidの呼び出し結果はundefinedですが、型システムではそれを使わないよう促されます。voidは「この戻り値を無視する」と捉えてください。
function save(): void {
console.log('saved');
}
const result = save(); // result has type void
console.log(result); // undefined at runtimeコールバック型における void
微妙ですが強力なルールがあります。戻り値がvoidとして型付けされたコールバックには、任意の値を返す関数を渡せます。余分な戻り値は単に無視されます。
type Handler = () => void;
const h: Handler = () => 42; // returns number, still fine
h();
console.log('Returned value is ignored by callers');このルールが存在する理由
この柔軟性により、数値を返すarr.pushのような関数をvoidコールバックとして渡せます。呼び出し側は戻り値を使わないと約束しているため、何かを返しても問題ありません。
const items: number[] = [];
const nums = [1, 2, 3];
nums.forEach((n) => items.push(n)); // push returns number, ok
console.log(items);配列メソッドにおける文脈上の void
forEachは、voidを返すコールバックを想定しています。そのため、値を意図せず返す1行のアロー関数を、エラーなしで記述できます。文脈上のvoid型がその戻り値を受け止めるためです。
const result: string[] = [];
['a', 'b'].forEach((x) => result.push(x.toUpperCase()));
console.log(result);よくある混同
voidコールバックのルールは、コールバックの型に適用されるものであり、独自に注釈した戻り値がvoidの関数に適用されるものではありません。(): voidと明示的に宣言された関数では、非undefined値を伴うreturn value;は依然として記述できません。
function f(): void {
return; // ok
// return 5; // Error: 5 not assignable to void
}
f();
console.log('declared void cannot return a value');void 型のパラメーターは特殊
まれではありますが、高度なジェネリクスではvoidをパラメーター型として使用できます。日常的なコードでは、ほとんどの場合、意味のある結果がないことを示す戻り値の型として目にします。
type Listener = (event: string) => void;
const onClick: Listener = (e) => console.log('Event:', e);
onClick('click');Promise と void
非同期関数では、処理を実行するものの、値なしで解決する場合にPromise<void>を返すことがよくあります。このパターンは、同期コードにおけるvoidを非同期コードに対応させたものです。
async function sync(): Promise<void> {
console.log('syncing...');
// resolves with no value
}
sync().then(() => console.log('done'));void を意図的に選択する
関数が副作用を目的として存在し、呼び出し側が戻り値に依存してはいけないことを伝えたい場合は、voidを注釈として付けてください。意図が明確になり、柔軟なコールバックのルールも活用できます。
function notify(msg: string): void {
console.log('NOTIFY:', msg);
}
const handlers: Array<(m: string) => void> = [notify];
handlers.forEach((fn) => fn('ping'));理解度チェック
void 型についての理解度を確認しましょう。
振り返り: void
voidについて、次のことを学びました。
- 有用な値を返さない関数を示します。
undefinedとは異なり、void の結果は使用すべきではありません。- コールバック型としては、任意の値を返す関数を受け入れます（呼び出し側では無視されます）。
forEach内でpushのようなメソッドを自然に使用できます。
次は、すべてを組み合わせてunknownを安全に扱います。
const tasks: Array<() => void> = [
() => console.log('task 1'),
() => console.log('task 2')
];
tasks.forEach((t) => t());よくある質問
「関数におけるvoid型」レッスンは無料ですか？
はい。「関数におけるvoid型」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、TypeScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 TypeScript Academyコースには全4レッスンが含まれています。
「関数におけるvoid型」で何を学びますか？
関数の戻り値の位置で、voidがundefinedとどのように異なるかを学びます。 ブラウザで直接実行するハンズオンコードでTypeScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
TypeScript Academyを始めるのに経験は必要ですか？
事前経験は必要ありません。CoddyKitのTypeScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/4です。
「関数におけるvoid型」レッスンにはどのくらい時間がかかりますか？
ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このTypeScript Academyレッスンでコードを書いて実行できますか？
はい。すべてのTypeScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- unknownとanyを理解する
- never型と不可能な状態
- 関数におけるvoid型
- unknownの型安全な扱い