【TypeScript】interfaceとtypeの違いは？基本的な使い方を徹底解説！

TypeScriptの型定義では、「interface」と「type」の２つがあります。

本記事では、それぞれの違いと基本的な使い方について解説します。

interfaceとtypeの違い

TypeScriptにおいて「interface文」と「type文」はどちらも型定義を行います。

以下の表を利用して、それぞれの機能を示します。

interfaceの使い方

interfaceの宣言は、型名を新規作成する方法の一つになります。

また、interface宣言で扱えるのはオブジェクト型のみになります。

interface FooBarObj {
    foo: number;
    bar: string;
}

const obj: FooBarObj = {
    foo: 0,
    bar: "Hello"
};

interface宣言は、FooBarObjといった型名を作成しており、実体はオブジェクト内のfooとbarの型です。

ほとんどの場合、interface宣言はtype文で代用可能です。

また、type文のほうがより多くの場面で使用できるため、interface宣言を使用せずtype文のみを使用する流れもあるようです。

基本的にはtype文を利用すれば問題ないため、今後TypeScriptプログラムを実装する人であればinterface宣言を使用する機会は少ないと思います。

ただ、type文が存在せずinterface宣言のみ利用可能だった時期（2014年以前）があった歴史的経緯のため、オブジェクト型作成時にinterface宣言を使う人もいるようです。

typeの使い方

type文は、型名を宣言する機能になります。

type FooBarObj {
    foo: number;
    bar: string;
};

const obj: FooBarObj = {
    foo: 0,
    bar: "Hello"
};

ここでもinterfaceと同様、FooBarObjといった型名を作成しています。

type文で間違えやすい2点を確認しておきます。

type FooObj = { foo: number };
type MyObj = FooObj;

const obj: MyObj = { foo: 0 };

上記のように、FooObjといった型を宣言した後に、改めてMyObjといった型名にてFooObjに別名を作成しています。

そのため、type文は決して「新たに型を作って利用可能にする」ものではなく、「すでにある型に別名をつける」ものであることが重要です。

TypeScriptのinterfaceは必要なのか

結論としては、使い分ける必要がある場面が存在します。

interfaceは拡張可能であり、同じ名前のインターフェースが自動的にマージされますが、typeは拡張できません。

そのため、一般的にオブジェクトの型を定義する場合はinterfaceが推奨されますが、複雑な型の操作が必要な場合はtypeが適しています。