寝て起きて寝て

プログラミングが出来ない情報系のブログ

InterfaceとType

最近TypeScriptを真面目に勉強しようと思いTypeScript Deep Dive日本語版の型エイリアス(Type Alias)を読んでいた時のこと

こんな感じで書かれていた

interfaceとは違って、型エイリアスは文字通りどんな型アノテーションにも与えることができます(ユニオン型や交差型のようなものに便利です)。構文に慣れ親しむための例をいくつか次に示します。

~~~~~~~

ヒント:型アノテーションの階層を持つ必要がある場合は、interfaceを使います。インターフェースはimplementsとextendsで使うことができます
ヒント:型エイリアスは、比較的単純なオブジェクト構造(Coordinates(座標)のような)にセマンティックな名前を付けるために使いましょう。また、ユニオン型や交差型にセマンティックな名前を付けたい場合に用いるのもよいでしょう。

何を言っているのかよく分からねぇ

ってことでひとつづつ読み解いていく

アノテーション

上の方で基本アノテーションと書かれているところこと
要は変数や引数、戻り値などがどんな型で入ってくるかを指定していることのことを指しているっぽい

セマンティック

「意味の、語義の、意味論の、意味的な」のような意味の単語らしいから
「セマンティックな名前を付けたい場合」というのは、 意味のある名前を付けたい場合 みたいな意味になりそう

アノテーションの階層

これがよくわからなかった。
察するにArrayやObjectの型内でネストが深い場合はinterfaceを使えって言ってるっぽい?
いやでも下みたいな書き方できるしな・・・謎

type BookStore = {
  name:string
  id:number
  books:Array<{
    name:string
    price:number
  }>
}

からの検索してみたら type vs interface みたいな項目があった

これを見ると

  • ユニオン型や交差型が必要な場合にはtypeを使います。
  • extendやimplementsをしたいときはinterfaceを使います。
  • そうでなければ、その日あなたを幸せにするものを使用してください。

と書かれているので機能的にはどちらも同じようなもんだし好きな方使って良いっぽい
交差型使えば継承っぽいことできるので宣言元がextendとかで書かれている場合はinterfaceを使えばいいんじゃないかな・・・

個人的はtypeの方がわかりやすいので好きです

type BookStore = {
  name:string
  id:number
  books:Array<{
    name:string
    price:number
  }>
}

const store:BookStore = {
  name:"a",
  id:1,
  books:[
    {name:"b",price:2}
  ]
}

type Owner = BookStore & {
  ownerName:string
}

const owner : Owner={
  ownerName:"ヤマダ",
  name:"a",
  id:1,
  books:[
    {name:"b",price:2}
  ]
}
console.log(store)
console.log(owner)

備考

インターフェースの説明
interfaceとtypeの違い、そして何を使うべきかについて