typeとinterface

1/9 TypeScript type & interface

型定義を行うtypeとinterface 2/9 typeは無名の型に参照のための別名をつける記述であり、 interfaceは型に名前をつけて宣言する記述 この型は BROTHERとSISTER 両方とも指定できる 基本的なケースにおいては、両方とも同じ使い方ができる

typeとinterfaceの歩み 3/9 ・2016年時点では、Microsoftがinterfaceを使うことを推奨していた ・typeに新しい機能が追加されていき、interfaceと似た機能を持つようになった ・現在では、いくつかの差別点を活用して適切な使い分けが推奨されている

typeの記述について 4/9 Typeは定数に代入するときと似た書き方をする typeによる代入 constによる代入 どちらも＝が用いられ、フォーマットを行うと末尾にセミコロンが付く

interfaceの記述について 5/9 interfaceは関数やクラスを定義するときと似た書き方をする interfaceによる定義 functionによる定義 どちらも＝が用いられず、フォーマットを行っても末尾にセミコロンが付かない

typeと定数、interfaceとオブジェクト それぞれ、定義方法が似ているものと同じような使い方ができる typeは定数の代入と記述が似ているので... ・同名のtypeを宣言するとエラーになる ・継承はできない ・if(a && b)のように、掛け合わせることができる ・配列やタプルも宣言可能 interfaceは関数やクラスの定義と記述が似ているので... ・クラスのように、extendsで継承ができる ・オブジェクトの型のみ定義できる これらの特徴などによって、それぞれの拡張性に差が生じてくる 6/9

typeの拡張性 7/9 typeの場合は、Intersection型やUnion型を宣言し、 新しい型を作ることができる Intersection型 USERの型は、 name: string age: number email: string password: string となる Union型 USERの型は、 name: string age: number または email: string password: string のどちらかとなる 新しい型を作るには新しいtypeを宣言する必要があるため、 拡張性は乏しいが、安定した型利用ができる

interfaceの拡張性 8/9 Interfaceの場合、マージや継承などを行うことで 型を拡張することができる マージ 継承 SISTERの型は、 name: string age: number hobby: string となる Interfaceは柔軟な型拡張ができるが、 予期せぬ拡張によるバグに注意する必要がある SISTERの型は、 name: string age: number address: string となる

typeとinterface どちらを使うべきか ・最終的に達成できることはあまり変わらない ・そのコードを実際に編集する人が不特定多数かで決めればよい？ ・アプリ開発など、開発人数が定まっており、 安定性が求められているケースであればtypeが望ましく思われる ・ライブラリやOSSなど、不特定多数の開発者が 自由に使うならば、柔軟性があるinterfaceが望ましく思われる 9/9