【TypeScript】TypeScriptで別ファイルからclassを呼び出す方法。

TypeScriptで別ファイルからclassを呼び出す方法。
1. 「import 〜 from 〜」、「interface」を使う方法
2. 「require」を使う方法

TypeScriptで別ファイルからclassを呼び出す方法。

今回の記事ではTypeScriptを用いて別ファイルのclassを呼び出す方法を紹介します。

TypeScriptのclassに関しての記事も記載していますので興味のある方はご参照ください。

「import 〜 from 〜」、「interface」を使う方法

コチラがclassの引き継ぎの方法ではメインの方法になってくると思われます。

まず引き継ぎ先のclassの存在するファイルです。

export interface test_interface {
  test1: string;
  test_function(): void;
}
export default class test_class implements test_interface {
  test1: string ="testok"
  test_function() {
      console.log(this.test1);
  }
}

では説明していきましょう。
まず下記の記述にて「interface」を定義しています。「interface」の使い方を詳しく知りたい方はコチラの記事をご参照ください。
まあ実はこの「interface」はなくても大丈夫なのですが笑。使わない場合は「class」の後ろの「implement interface名」を消してください。
「interface」で記載している変数の「test1」はString型、関数「test_function()」はreturnさせるものはないのでvoid型に設定します。

export interface test_interface {
  test1: string;
  test_function(): void;
}

次に下記でclassを記述しています。

export default class test_class implements test_interface {
  test1: string ="testok"
  test_function() {
      console.log(this.test1);
  }
}

「test1」という変数に「testok」というString型の文字を入れています。
関数「test_function()」のconsole.logのカッコ内には「this.test1」を記載。「this」はなくてもいいのですが、このclass内で定義している変数を用いる場合は使用しておいた方が見やすくなります。TypeScriptですとDocumentの意味合いもあるので特に書いておいた方がいいと思います。

次に呼び出す先のファイルを作成していきましょう。

import test_class from "./test_class_file"

const test2 = new test_class()
test2.test_function()

コチラの説明としては、test2でインスタンスを作成しclassの関数を呼び出しています。
そしてその下のコードで関数を使用しているだけです。

「require」を使う方法

export class test_class{
  test(){
    console.log('test');
  }
}

コチラに簡単なclassとtest()関数を記載。
このクラスを呼び出して別のファイルから使えるようにします。

上記コードの解説として「export class名」でクラスの定義を行い、中身の関数を記載する。
呼び出しがわのコードはかきにする。

import test1 = require('./test_class_file');
    var test2 = new test1.Mymodule();
    test2.test();

これで呼び出せるはずです。

今回は「require」を使いましたが、他の呼び出し方法もあります。では他のやり方も記載していきましょう。

どちらを使うのがいいのか正直わかりませんがおそらく上の「interface」を用いる方が一般的なのではないかと思います。
もっと勉強します。。