Typescript勉強ノート #2_Narrowing編

はじめに

Typescriptを使いこなせるようになるためにドキュメントを読んで勉強する。
typescript Documentation: https://www.typescriptlang.org/docs/handbook/intro.html
自分用なのであるていど把握できていると思う部分はスキップしていく。

今回は、ドキュメントのNarrowingを参考にしてまとめる。
https://www.typescriptlang.org/docs/handbook/2/narrowing.html

typeof type guards

tyoeofを使って型を知ることができる。型よる絞り込みを行える。

const hoge = ( fuga : string | number ) => {
  if ( type of fuga === "string" ) {
     alert( "これはstringです！" )
     return;
  }
  alert( "これはnumberです！" )
  return; 
}

The in operator narrowing

inを使うことでオブジェクトに指定したプロパティがあるがどうか判断することができる。
これによって絞り込みを行える。

type Fish = { swim: () => void, place: "sea" };
type Bird = { fly: () => void, place: "sky" };

const move = (animal: Fish | Bird) => {
  if("swim" in animal) {
    console.log(animal.place); // sea
  }
  console.log(animal.place); // sky
}

The instanceof narrowing

指定したインスタンスであるかどうかを判断することができる。これによって絞り込みを行える。インスタンスとはクラスから生成したオブジェクトのこと。

class Animal {
  name: string;
  constructor(name) {
    this.name = name;
  }
}

const pet = new Animal('taro'); // petがインスタンス
 if (pet instanceof Animal) {
   alert("Animalです!");
 }

Using type predicates

isを使って直接的な表現で型の制御ができる。
あまり実用するイメージがわかなかったが、こんなものがあるというのを知っておくためにメモ。

// ドキュメントよりそのまま引用
function isFish(pet: Fish | Bird): pet is Fish { // petがFishであるかどうか
  return (pet as Fish).swim !== undefined;
}

let pet = getSmallPet();
 
if (isFish(pet)) {
  pet.swim();
} else {
  pet.fly();
}

おわり

次は、https://www.typescriptlang.org/docs/handbook/2/functions.html