タイプスクリプトにおける型対インタフェース


注:この記事の「型」という用語は、typescriptの「type」別名に言及しています
official Typescript documentによると、「typescriptは、静的なタイプ定義を加えることによって、JavaScript(世界で最も使用されたツールのうちの1つ)を構築するオープンソース言語です.」私たちのプロジェクトでtypescriptを実装するのは、長い間、多くの時間を節約します.しかし、開発者として、我々はベストプラクティスと標準TypeScriptでの種類の作業時に従う必要があります.
この記事では、2つのタイプtypeのエイリアスとinterfaceの違いを見ます.多くの開発者は、これらの2つの本当の違いを本当に知りません.違いを知って、我々は我々のために最高のユースケースに従ってこれらを実装することができます.

由来
インターフェイスは、オブジェクトの形状/構造などのデータ構造を定義するために使用されます.
型はデータの型を定義するために使用されます.たとえば、プリミティブ、ユニオン、交差、タプルデータ型.

型評価時間
型評価期間に微妙なキー差があります.typeのエイリアスに対するタイプ評価は即時ですが、interfaceのタイプ評価は怠惰です.

型宣言構文
両方の型とインターフェイスを同様の方法で使用できますが、宣言構文は異なります.
type BulldogType = {
  name: string;
  height: number;
  weight: number;
}

interface BulldogInterface {
  name: string;
  height: number;
  weight: number;
} 

キーワードの拡張と実装
タイプスクリプトでは、interfaceを使用して型を拡張して実装できます.これはtypeエイリアスを使用することはできません.
interface Dog {
  breed: string;
}

interface Bulldog extends Dog {
  isCute: true;
}

交差点
我々は242479142の複数のtypesinterfaceをシングル&に組み入れることができます.しかし、我々はそれらを一つのtypeに結合することはできません.
type Bulldog = { }
type GermanShepherd = {}

type DogBreeds = Bulldog & GermanShepherd; // valid

interface IBulldog {}
interface IGermanShepherd {}

type IDogBreeds = IBulldog & IGermanShepherd; // valid


労働組合
Union型は、“interface”キーワードで1つまたは2つ以上の他の型の値を持つことができる新しい型を作成できます.
私たちは、複数の|typesをユニオンのキーワードと組み合わせることができます.しかし、我々はそれらを一つのinterfaceに結合することはできません.
type Bulldog = { }
type GermanShepherd = {}

type DogBreeds = Bulldog | GermanShepherd; // valid

interface IBulldog {}
interface IGermanShepherd {}

type IDogBreeds = IBulldog | IGermanShepherd; // valid

合併の宣言typeは、合併を宣言するのを許します.
interface IBulldog {
 name: string;
}
interface IBulldog {
 weight: number;
}

const bruno: IBulldog = {
  name: "Bruno",
  weight: 22
}
しかし、interface別名を使用してタイプが作成されると、interfaceエイリアスを変更できません.したがって、宣言のマージはtypeエイリアスでは不可能です.
type IBulldog = {
 name: string;
}
type IBulldog = {
 weight: number;
}

// Error: Duplicate identifier 'IBulldog'