スポンサーリンク

【TypeScript】interfaceとは? 「interfaceで型定義を行う使用例ご紹介 」

TypeScript
スポンサーリンク

今回の記事はTypeScriptの「interface」の使用方法に関しての記事になります。実際interfaceなんてこれまでPythonとかJavaとかSwiftでも使ったことがなかったのですが今回TypeScriptを使用するにあったて一度勉強してみようと思い、使用方法をまとめてみました。

スポンサーリンク

「interface」とは?

簡単にいうとTypeScriptにおける「interface」とはなんなのかというと、「interface」は要は名前を管理しておく塊みたいなものと考えれば良いと思います。実際にコードで説明していきましょう。

「interface」の使い方

interface test_interface{
    test1:string
}

class test_class implement test_interface{
    test1:string;
}

「interface」を定義する場合、上記のようにinterface内でtest1を定義していると「implement」して「class」では必ず上記のtest1を使用しなければならないというルールが作られる。

これを応用して使用される使い方をご紹介します。

型の定義を「interface」で行う

interface test_interface {
    name:string
}

class A implements test_interface{
    name = "A";
}
class B implements MyIterface{
    name = "B";
}

var testArray:test_interface[] = [new A(),new B()];

これは一番下記の配列の型の定義をinterfaceにて一括して行うことができます。これは整理しやすいです。

「interface」のメリット

interfaceを使うことでどのようなメリットがあるのかですがコードをかく上では記述量が増えるので大変ではありますが、コードを管理すると言う意味ではどうでしょうか。

例えば二人で開発をしているとしてフロント側で入力欄を作りそこにDBへ登録するなどの機能をつける場合があると思います。
このような開発の中では一人で製作している場合は個人で要素のid等を管理できていると思いますが、二人で作業する場合、この要素(今回は入力欄)のidは何?と聞いて理解した上で必要なDB側の処理を記述すると言う流れになると思われます。
これを毎回聞くのはめんどくさいですよね!

それを防ぐために「interface」に全て記入しておけば管理が楽ということです。

今回の記事は以上です。他にもTypeScriptの記事を多数記載しているので気になる方は是非参考にしてみてください。

本記事を読んでいただき感謝です。サイトを訪れていただいた方はプログラミング勉強中かと思いますのでプログラミング勉強のコツを合わせてご紹介。

スポンサーリンク
スポンサーリンク
スポンサーリンク

ブログに関しては500円程度かかりますが、それ以外は無料です。知識の吸収と並行してアウトプットは非常に効率が良いです。テックアカデミーに関しては講座レベルが高いにも関わらず、無料体験や人気口座も大幅値下げがあるので、重点的に学びたいものを無料体験してみてください。

転職時にも、エンジニアからテックアカデミー・Paizaは認知度が高いので、未経験入社採用を行う際履歴書で目に留まります。特にPaizaのスキルレベルA・SなどはIT業界でも評価されます。

テックアカデミー・Paizaの無料登録ができる期間中にぜひご利用してみてください。私も活用経験ありです。

TypeScript
スポンサーリンク
スポンサーリンク
ともぶろぐ

コメント

タイトルとURLをコピーしました