TypeScriptのインターフェース（interface）とは？基本構文と使い方

1. インターフェース（interface）とは？

1. インターフェース（interface）とは？

TypeScriptのインターフェース（interface）は、オブジェクトの「型のルール」を定義する仕組みです。ここでいう「型」とは、データの形や構造のことを指します。例えば「人間」という型を作るときに、名前や年齢などを持つことをルールとして決められるのです。

もしインターフェースを使わなければ、自由にデータを書けてしまいます。その結果、誤字や不足でプログラムがエラーになりやすくなります。しかし、インターフェースを使えば、事前に「こういう形でデータを作ってください」と決められるので安心です。

2. インターフェースの基本構文

2. インターフェースの基本構文

インターフェースを定義するときは、interfaceというキーワードを使います。その後に名前をつけて、中にプロパティ（データの項目）を書きます。例えば、人の情報を表すインターフェースは次のように書きます。

interface Person {
    name: string;
    age: number;
}

この例では、Personというインターフェースを定義しています。必ずnameは文字（string）、ageは数字（number）でなければいけません。

3. インターフェースを使ったオブジェクト定義

3. インターフェースを使ったオブジェクト定義

定義したインターフェースを使うときは、変数や関数に「この形を持ってください」と指定します。次のサンプルコードを見てください。

interface Person {
    name: string;
    age: number;
}

let user: Person = {
    name: "田中太郎",
    age: 25
};

console.log(user.name);

田中太郎

このように、userという変数には必ずnameとageが必要になります。もしageを忘れたり、文字列にしてしまったりすると、TypeScriptがエラーを出して教えてくれます。

4. プロパティをオプションにする方法

4. プロパティをオプションにする方法

ときには「このデータはあってもなくてもよい」という項目を作りたいことがあります。その場合は、インターフェースでプロパティ名の後ろに?をつけます。

interface Person {
    name: string;
    age?: number;
}

let user1: Person = { name: "山田花子" };
let user2: Person = { name: "佐藤一郎", age: 30 };

この例では、ageは「任意（オプション）」の項目になっています。そのため、user1には年齢がなくても大丈夫です。

5. インターフェースの利点

5. インターフェースの利点

インターフェースを使うと、次のような利点があります。

• 型チェックが自動で行われるので、間違ったデータを入れにくい
• コードの見通しがよくなり、チーム開発でも理解しやすくなる
• 後から拡張できるため、柔軟に対応できる

例えば、大規模なアプリでは多くの人が同時にコードを書くので、ルールがないと「誰かの書いたデータの形」が分からなくなってしまいます。インターフェースを使えば、統一された書き方ができるので便利です。

6. 実生活の例えで理解する

6. 実生活の例えで理解する

インターフェースをもっとイメージしやすくするために、身近な例で考えてみましょう。たとえば、レストランの「注文用紙」を想像してください。注文用紙には必ず「料理の名前」と「数量」を書く欄があります。このフォーマット自体がインターフェースにあたります。

お客さんが記入するのは実際のデータ（オブジェクト）です。もし数量を空欄にしたり、文字で「三つ」と書いたら、店員さんは困ってしまいますよね。TypeScriptのインターフェースも同じで、「正しい形」で書かれているかをチェックしてくれるのです。

まとめ

まとめ

TypeScriptのインターフェース（interface）について振り返ると、オブジェクトやクラスの「形」をあらかじめ決めておくことで、より安全で理解しやすいプログラムを書くための仕組みであるという点がよく見えてきます。インターフェースは、データの項目や構造を明確に定義し、それに従ってオブジェクトを作成することで、思わぬエラーを未然に防いでくれる強力な型システムの一部です。特にプロジェクトが大きくなるほど、各所で扱うデータの形を統一することが重要になり、インターフェースが果たす役割はより大きくなります。 インターフェースを使わなければ、値を入れ忘れたり型を間違えたりしても気づきにくく、思わぬ不具合につながってしまいます。しかし、interfaceを導入することで、TypeScriptが自動でチェックしてくれ、誤りを早い段階で発見できます。また、オプションプロパティを使うことで、柔軟に設計しながらも最低限のルールを維持でき、仕様変更にも対応しやすくなります。こうした点は、実務において特に重要になります。 さらに、インターフェースはオブジェクトだけでなく、クラスの設計にも用いることができ、「どんなメソッドを持つべきか」など、実装の指針を示す役目も果たします。これにより、複数人での開発でもブレの少ないコードが書けるようになります。以下では、今回の理解をさらに深めるために、インターフェースとクラスを組み合わせた実用的なサンプルコードを用意しました。

サンプルプログラム：インターフェースとクラスの組み合わせ

interface Product {
    name: string;
    price: number;
    description?: string; // オプション項目
}

class Item implements Product {
    name: string;
    price: number;
    description?: string;

    constructor(name: string, price: number, description?: string) {
        this.name = name;
        this.price = price;
        this.description = description;
    }

    showInfo() {
        console.log("商品名：" + this.name);
        console.log("価格：" + this.price + "円");
        if (this.description) {
            console.log("説明：" + this.description);
        }
    }
}

const book = new Item("入門TypeScript", 1980, "初心者向けの学習書です");
const pen = new Item("ボールペン", 120);

book.showInfo();
pen.showInfo();

このサンプルでは、「商品」というデータ構造をProductインターフェースとして定義し、それを実装するItemクラスを作っています。インターフェースで型を決めておくことで、どんな商品であっても必ず名前と価格を持つことが保証されます。また、説明文はオプションにすることで、必要なときだけ設定できる柔軟な設計が可能になります。インターフェースを使うことで、クラスの設計意図が明確になり、扱うデータのブレを防ぐことができるのです。 このような仕組みは、ユーザー情報、商品情報、設定データなど、さまざまな用途で活用できます。データの形をしっかり決めておくことで、複雑な処理の中でも安全性と統一性を維持しながら開発を進められます。TypeScriptのインターフェースは、プログラム全体の見通しを良くし、初心者から経験者まで多くの開発者にとって強力な味方になるでしょう。