型アサーションの基本構文

型アサーションは、コンパイラに対して「開発者が変数の型をより具体的に把握している」ことを伝えるための仕組みです。主に2種類の構文が存在します。

1. アングルブラケット構文

<型>変数 という形式で記述します。JSXを使用するプロジェクト（Reactなど）では、タグの構文と競合するため、次に紹介する as 構文が推奨されます。

let inputVal: any = "Tech Blog";
let valLength: number = (<string>inputVal).length;

// 複数の型を持つユニオン型からのアサーション
let mixedData: string | number = "Tokyo";
let charCount: number = (<string>mixedData).length;

2. as 構文（推奨される形式）

変数 as 型 という形式で記述します。現代的なTypeScript開発においては、こちらが一般的です。

let responseData: any = "Success";
let textLength: number = (responseData as string).length;

注意点： 型アサーションは、コンパイル時のチェックを回避するだけであり、実行時のエラーを防ぐものではありません。実際のデータ型がアサーションした型と異なる場合、実行時にランタイムエラーが発生する可能性があります。実行時の安全性が確実な場合にのみ使用してください。

非空アサーション（Non-null Assertion Operator）

変数名の後に ! を付けることで、その変数が null または undefined ではないことをコンパイラに伝えます。

type Logger = () => void;

function executeLog(logFn: Logger | null | undefined) {
    // logFn() と直接記述すると、null/undefinedの可能性があるためエラーになります
    logFn!(); // ! を付けることでエラーを解消
}

なお、strictNullChecks が有効な設定（tsconfig.json）において、このチェックは機能します。

確実な代入アサーション（Definite Assignment Assertions）

変数が初期化される前に使用される可能性がある場合、TypeScriptはエラーを報告します。! を変数宣言時に使用することで、その変数が実行時に必ず値を持つことを保証できます。

let globalConfigId!: number;

function setup() {
    globalConfigId = 2024;
}

setup();
console.log("Config ID: " + globalConfigId);

このアサーションがない場合、setup() 内で代入されることをコンパイラが認識できず、「割り当てられる前に使用されています」というエラーが発生します。

any型へのアサーションとオブジェクト拡張

動的にプロパティを追加したい場合など、型定義が追いつかない場面で一時的に any へアサートすることがあります。

interface UserBase {}

const userInfo: UserBase = {};
// UserBaseにはname属性がないため、通常はエラーになる
(userInfo as any).name = "Alice";
(userInfo as any).role = "Admin";

関数呼び出しにおける型の制約

戻り値や引数が any で定義されている関数を利用する際、呼び出し側で具体的な型を明示することで、その後のコードの安全性を高めることができます。

function processPayload(data: any): any {
    return data;
}

// 呼び出し時に引数と戻り値の型を明示する
let result = <number>processPayload(<string>"SampleData");

これをJavaScriptにコンパイルすると、型アサーションの部分はすべて削除され、純粋な関数呼び出しのみが残ります。

function processPayload(data) {
    return data;
}
var result = processPayload("SampleData");