TypeScriptのカプセル化の基本

最近、趣味でTypeScriptを使い始めている。

TypeScriptは、プログラミング言語の一種で、専用のコンパイラにかけるとJavaScriptコードが生成される。

つまりはJavaScriptのメタ言語だ。

TypeScriptにはこんな素晴らしい特徴がある。

  • オブジェクト指向プログラミングが可能。
  • 既存のJavaScriptライブラリも使える。
  • 変数や関数を沢山つくってもグローバル領域の汚染が起こりにくい。
  • 型定義が必須なので、関数の使い方がカオスになり難い。

公式サイトのドキュメントがとても充実していて習得しやすいんだけど、ビルドするときに自動でかけている静的文法チェックツール「TSLint」の指摘がとっても厳しくて四苦八苦している。

その中でもとりわけ手間取らされ、苦労したのがこれ↓

‘namespace’ and ‘module’ are disallowed.

「名前空間とモジュールは使っちゃダメだよっ」ということらしい。

namespaceやmoduleを書いた行で決まってこの文法エラーが表示される。

え、なんで?

TypeScriptって、名前空間とモジュール構造に対応しているから、同名のクラスでもきちんときれいに棲み分けできるのが売りなんじゃないの?

一瞬頭の中が真っ白になるご指摘をなさる。

エラー文で検索すると、TSLintの公式サイトに載ってた。

どうやら名前空間とモジュールというのは、JavaScriptで最近定義されたモジュール化の書き方からかけ離れているのでダメ、ということらしい。

きちんとJavaScript(ECMAScript6)のimport / exportの書き方に則って書きなさいよ!ということだ。

JavaScriptも進化してるのね。そりゃそーか。

TypeScriptはというと、今でこそnamespaceとmoduleはきちんとコンパイルしてくれるけど、これらが使えなくなるのは時間の問題かもね。

で、どうすれば従来の名前空間やモジュールのように「同名だけど違う機能のクラスを分類する」かだけど、次のようにすれば良いみたい。

まずモジュールが2つあるとして、そのうちの1つのコード(mymodule1.ts)

export default class MyClass {
  public MyFunction(): void{
    alert('モジュール1');
  }
}

もう1つのモジュールのコード(mymodule2.ts)

export default class MyClass {
  public MyFunction(): void {
    alert('モジュール2');
  }
}

続いてモジュールを使う側のコード

import MyClass1 from './mymodule1';
import MyClass2 from './mymodule2';

const myInstance1 = new MyClass1();
const myInstance2 = new MyClass2();

myInstance1.MyFunction();
myInstance2.MyFunction();

コメントする