is キーワードに関する注意点

2024-04-02

TypeScript の is キーワード：型ガードの詳細解説

is キーワードは、変数が特定の型であるかどうかをチェックするために使用されます。これは、条件分岐や型パラメーターの推論など、さまざまな場面で役立ちます。

例：条件分岐での使用

const value = 123;

if (typeof value === "number") {
  // value は数値型であることが確実なので、数値として処理できる
  console.log(`value は数値です: ${value}`);
} else {
  // value は数値型ではない
  console.log(`value は数値ではありません: ${value}`);
}

上記のコードでは、typeof 演算子を使用して変数の型をチェックしていますが、is キーワードを使うと、より簡潔に記述できます。

const value = 123;

if (is.number(value)) {
  // value は数値型であることが確実なので、数値として処理できる
  console.log(`value は数値です: ${value}`);
} else {
  // value は数値型ではない
  console.log(`value は数値ではありません: ${value}`);
}

例：型パラメーターの推論

function myFunction<T>(value: T): T {
  if (is.string(value)) {
    // value は文字列型であることが確実なので、文字列として処理できる
    return value.toUpperCase();
  } else if (is.number(value)) {
    // value は数値型であることが確実なので、数値として処理できる
    return value.toFixed(2);
  } else {
    // value は上記以外の型
    return value;
  }
}

const result = myFunction("Hello, world!"); // "HELLO, WORLD!"
console.log(result);

const numberResult = myFunction(123.456); // "123.46"
console.log(numberResult);

上記のコードでは、is キーワードを使用して、関数のパラメーターの型を推論しています。

is キーワードは、以下の形式で使用されます。

is.<型名>(変数)

<型名> は、チェックしたい型を指定します。

例

const value = "Hello, world!";

if (is.string(value)) {
  // value は文字列型であることが確実なので、文字列として処理できる
  console.log(`value は文字列です: ${value}`);
} else {
  // value は文字列型ではない
  console.log(`value は文字列ではありません: ${value}`);
}

is キーワードを使用する利点は、以下のとおりです。

コードの可読性が向上する。
型安全性を向上させることができる。
コードの冗長性を減らすことができる。

is キーワードに関する注意点

is キーワードは、TypeScript 2.0 以降で使用できます。
is キーワードは、型ガードの一種であり、他の型ガードと組み合わせて使用することができます。

まとめ

is キーワードは、TypeScript の型ガード機能に役立ちます。is キーワードを理解することで、コードの可読性、型安全性、簡潔性を向上させることができます。

TypeScript の is キーワードを使用したサンプルコード

条件分岐での使用

const value: any = 123;

if (is.number(value)) {
  // value は数値型であることが確実なので、数値として処理できる
  console.log(`value は数値です: ${value}`);
} else if (is.string(value)) {
  // value は文字列型であることが確実なので、文字列として処理できる
  console.log(`value は文字列です: ${value}`);
} else {
  // value は上記以外の型
  console.log(`value は不明な型です: ${value}`);
}

型パラメーターの推論

function myFunction<T>(value: T): T {
  if (is.string(value)) {
    // value は文字列型であることが確実なので、文字列として処理できる
    return value.toUpperCase();
  } else if (is.number(value)) {
    // value は数値型であることが確実なので、数値として処理できる
    return value.toFixed(2);
  } else {
    // value は上記以外の型
    return value;
  }
}

const result = myFunction("Hello, world!"); // "HELLO, WORLD!"
console.log(result);

const numberResult = myFunction(123.456); // "123.46"
console.log(numberResult);

型ガードの組み合わせ

function isEven(value: number): boolean {
  return is.number(value) && value % 2 === 0;
}

const number = 10;

if (isEven(number)) {
  // number は偶数であることが確実なので、偶数として処理できる
  console.log(`number は偶数です: ${number}`);
} else {
  // number は奇数
  console.log(`number は奇数です: ${number}`);
}

上記のコードでは、is.number 型ガードと value % 2 === 0 論理式を組み合わせて、number 変数が偶数かどうかをチェックしています。

カスタム型

interface Person {
  name: string;
  age: number;
}

function isPerson(value: any): value is Person {
  return is.object(value) && is.string(value.name) && is.number(value.age);
}

const person: any = {
  name: "John Doe",
  age: 30,
};

if (isPerson(person)) {
  // person は Person 型であることが確実なので、Person 型として処理できる
  console.log(`person は Person 型です: ${person.name}, ${person.age}`);
} else {
  // person は Person 型ではない
  console.log(`person は Person 型ではありません: ${person}`);
}

上記のコードでは、isPerson 型ガードを使用して、person 変数が Person 型かどうかをチェックしています。

その他

is キーワードは、上記の例以外にもさまざまな用途で使用できます。詳細は、TypeScript の公式ドキュメントを参照してください。

is キーワードの代替方法

typeof 演算子を使用して、変数の型をチェックできます。

const value: any = 123;

if (typeof value === "number") {
  // value は数値型であることが確実なので、数値として処理できる
  console.log(`value は数値です: ${value}`);
} else if (typeof value === "string") {
  // value は文字列型であることが確実なので、文字列として処理できる
  console.log(`value は文字列です: ${value}`);
} else {
  // value は上記以外の型
  console.log(`value は不明な型です: ${value}`);
}

上記のコードは、is キーワードを使用したサンプルコードとほぼ同じですが、typeof 演算子を使用して型をチェックしています。

instanceof 演算子を使用して、変数が特定のクラスのインスタンスかどうかをチェックできます。

class Person {
  constructor(public name: string) {}
}

const person = new Person("John Doe");

if (person instanceof Person) {
  // person は Person クラスのインスタンスであることが確実なので、Person クラスとして処理できる
  console.log(`person は Person クラスのインスタンスです: ${person.name}`);
} else {
  // person は Person クラスのインスタンスではない
  console.log(`person は Person クラスのインスタンスではありません: ${person}`);
}

型パラメーターに制約を付けることで、関数の引数の型をより詳細に指定できます。

function myFunction<T extends string>(value: T): T {
  // value は文字列型であることが確実なので、文字列として処理できる
  return value.toUpperCase();
}

const result = myFunction("Hello, world!"); // "HELLO, WORLD!"
console.log(result);

上記のコードでは、myFunction 関数の型パラメーター T に string 型の制約を付けています。

カスタム型ガードを作成して、特定の条件を満たすかどうかをチェックできます。

function isEven(value: number): boolean {
  return value % 2 === 0;
}

const number = 10;

if (isEven(number)) {
  // number は偶数であることが確実なので、偶数として処理できる
  console.log(`number は偶数です: ${number}`);
} else {
  // number は奇数
  console.log(`number は奇数です: ${number}`);
}