こんにちは！フロントエンドからバックエンドまで、TypeScriptの荒波を一緒に航海するシニアアーキテクトの私です。
今回は、TypeScriptの関数における「Rest Parameters（可変長引数）」をタプル型で厳密に制限するテクニックについてお話しします。
「何個でも引数を受け取れる便利なやつでしょ？」と、安易に `…args: any[]` や `…args: string[]` なんて書いていませんか？ その書き方、実はTypeScriptが持つ強烈な型安全性の恩恵をドブに捨てるようなものなんです。
ここをクリアすれば、関数の引数の順番や型がピタッとコンパイラに管理されるようになり、あなたの書くコードの信頼性は劇的に跳ね上がります。さあ、一緒にTypeScriptの真髄に触れていきましょう！
—
1. なぜ「普通の配列型 (`…args: any[]`)」では物足りないのか？
まずは、よくある「ちょっと残念なコード」を見てみましょう。複数の異なる型の引数を、順番通りに受け取りたい関数を想像してください。
// ❌ ありがちだけど、型がガバガバな例
function executeTask(…args: any[]) {
const taskName = args[0]; // 型は any
const retryCount = args[1]; // 型は any
const callback = args[2]; // 型は any
// 実行時エラーの匂いがプンプンしますね…
}
この書き方だと、何番目に何の型が来るべきかという「構造のルール」がTypeScriptのコンパイラに伝わりません。結果として、文字列を入れるべきところに数値を突っ込んでしまっても、TypeScriptは「おっ、OKだね」とスルーしてしまいます。これではJavaScriptとなんら変わりませんよね。
—
2. 救世主「タプル型によるRest Parametersの制限」
ここで登場するのが、タプル型（Tuple Type）をRest Parametersに適用するテクニックです。
「可変長」でありながら、「何番目に・何の型が来るか」を厳密に固定する。一見矛盾するようですが、TypeScriptならこんな風に書けます。
// ⭕️ タプル型でガチガチに型を縛った例
type TaskParams = [taskName: string, retryCount: number, callback: (success: boolean) => void];
function executeTask(…args: TaskParams) {
// args は [string, number, (success: boolean) => void] というタプルとして推論される！
const [taskName, retryCount, callback] = args;
console.log(`Task: ${taskName}, Retries: ${retryCount}`);
callback(true);
}
このコードの何がスゴいのか？（型評価の裏側）
コンパイラは、この `…args: TaskParams` を見た瞬間、この関数に渡される引数の「数」と「順番」と「型」を完全に固定します。
実際に呼び出す側のコードを見てみましょう。
// 正しい呼び出し
executeTask(“DataSync”, 3, (result) => {
console.log(“Completed:”, result);
});
// ✨ コンパイル成功！
// ❌ 間違った呼び出し（順番ミス、型ミス）
executeTask(3, “DataSync”, (result) => {
console.log(“Completed:”, result);
});
// 🔥 コンパイルエラー！
// 「型 ‘number’ の引数を型 ‘string’ のパラメータに割り当てることはできません」
お分かりいただけたでしょうか？ `executeTask` を呼ぶ瞬間、IDE（VSCodeなど）の補完機能が `[taskName: string, retryCount: number, …]` というラベル付きで引数をガイドしてくれます。人間がうっかり順番を間違える隙を、コンパイラが完全にシャットアウトしてくれるのです。
—
3. 実践：関数をラップする（Higher-Order Function）での応用
このタプルによるRest Parametersの制限は、既存の関数を安全にラップ（装飾）したり、ロギング機能を追加したりする「高階関数」を書くときに真価を発揮します。
例えば、任意の引数を受け取る関数を受け取り、その実行を安全にラップする関数を作ってみましょう。ここでジェネリクス（総称型）の `T` と組み合わせます。
// どんな関数であっても、その引数の型をタプルとして抽出して安全に扱う
function withLogging
fn: T,
logger: (…args: Parameters
): (…args: Parameters
return (…args: Parameters
logger(…args); // ログ出力に引数をそのまま渡す
return fn(…args); // 本来の関数を実行
};
}
// — 使用例 —
// 元となる関数
const createUser = (name: string, age: number, isAdmin: boolean) => {
return { id: Math.random(), name, age, isAdmin };
};
// ラップされた安全な関数を作る
const loggedCreateUser = withLogging(
createUser,
(name, age, isAdmin) => {
// ここでも name, age, isAdmin の型が完全に推論されている！
console.log(`[LOG] Creating user: ${name}, Age: ${age}, Admin: ${isAdmin}`);
}
);
// 呼び出し
const user = loggedCreateUser(“Alice”, 28, false);
// 出力: [LOG] Creating user: Alice, Age: 28, Admin: false
ここで使われている `Parameters
—
4. 陥りやすい罠と文法エラー
初学者のうちによくやってしまうミスについても触れておきますね。
罠①: ラベルの付け方の誤り
TypeScript 4.0以降ではタプルにラベル（例: `[name: string]`）をつけられますが、Rest Parametersで定義する際は少し注意が必要です。
// ❌ やってはいけない書き方
type BadParams = […args: [string, number]]; // 構文エラーになることが多い
// ⭕️ 正しい書き方
type GoodParams = [name: string, age: number];
function myFunc(…args: GoodParams) {}
Rest Parametersに指定するタプル自体には、そのまま型を並べるか、素直に `[string, number]` のように記述するのが最も安全で確実です。
—
まとめ：ここをクリアすればTypeScriptの基本はバッチリ！
いかがでしたか？
ただの「可変長引数」であった `…args` に、「タプル型による秩序」を与えることで、コードの安全性と開発者体験（DX）は劇的に向上します。
- `…args: any[]` は卒業する
- 順番と型を保証したいなら `[TypeA, TypeB]` のタプル型を使う
- 関数の引数を再利用したいときは `Parameters
` を活用する
この3つをマスターすれば、TypeScriptの関数型システムの基礎はもうバッチリです。自信を持って、より堅牢なアーキテクチャの構築に挑んでくださいね。それでは、次のステップでお会いしましょう！