1確認するまで操作できない
unknown の値は、typeof で型を確認するまで一切のメソッドを呼べません。any との決定的な違いである「コンパイラが確認を強制してくれる」性質を、最小の形で確かめる例です。
const mysteryValue: unknown = "hello";
// console.log(mysteryValue.toUpperCase()); // 確認前の操作はコンパイルエラー
if (typeof mysteryValue === "string") {
// 確認した後なら string として安全に操作できる
console.log(mysteryValue.toUpperCase());
}
2数値かどうかを確認してから計算
typeof で number と確認できたブロックの中では、toFixed や四則演算が使えるようになります。確認できなかった場合の処理も else に書く、unknown の基本の型に沿った例です。
const inputValue: unknown = 3.14159;
if (typeof inputValue === "number") {
// ここでは number として扱えるので計算できる
console.log(inputValue.toFixed(2));
console.log(inputValue * 2);
} else {
console.log("数値ではありませんでした");
}
3JSON.parse の結果を unknown で受ける
any のまま使いがちな JSON.parse の結果を、あえて unknown の変数で受ける実務の作法です。確認せずに計算しようとするとコンパイルエラーになるので、未確認のまま使う事故を型が防いでくれます。
// any のまま使わず、unknown で受けて「確認」を強制する
const parsedValue: unknown = JSON.parse("42");
// console.log(parsedValue * 2); // 確認前の計算はコンパイルエラー
if (typeof parsedValue === "number") {
console.log(parsedValue * 2);
} else {
console.log("数値ではないデータでした");
}
4複数の型を順番に確認する
外部から来る値が何種類かあり得るとき、else if で typeof を順に確かめていく形です。確認できた分岐の中だけそれぞれの型の操作が解禁される、unknown 処理の定番パターンです。
const externalValue: unknown = "typescript";
if (typeof externalValue === "string") {
console.log("文字列でした: " + externalValue.toUpperCase());
} else if (typeof externalValue === "number") {
console.log("数値でした: " + externalValue.toFixed(1));
} else if (typeof externalValue === "boolean") {
console.log("真偽値でした: " + externalValue);
} else {
console.log("対応していない型でした");
}
5配列かどうかを確認する
typeof では配列を区別できないため、配列の確認には Array.isArray を使います。API から届いた一覧データを安全に扱うときの定番で、確認に使う道具は typeof だけではないことを示す例です。
const listValue: unknown = ["apple", "banana", "cherry"];
// typeof では配列を区別できないので、Array.isArray で確認する
if (Array.isArray(listValue)) {
console.log("要素数: " + listValue.length);
console.log(listValue.join(" / "));
} else {
console.log("配列ではありませんでした");
}