Modules

グローバルモジュール(Global Module)

デフォルトでは、新しいTypeScriptファイルにコードを入力すると、コードはグローバル名前空間(global namespace)に入ります。デモとして、foo.tsファイルを考えてみましょう:

var foo = 123;

同じプロジェクトで新しいファイルbar.tsを作成すると、TypeScriptの型システムは、変数fooをグローバルに利用することを許容します:

var bar = foo; // allowed

言うまでもありませんが、グローバル名前空間を使うとコードで名前が競合する危険があります。次のファイルモジュール(File Module)を使用することをお勧めします。

ファイルモジュール(File Module)

external modulesとも呼ばれます。TypeScriptファイルのルートレベルにimportまたはexportが存在する場合、そのファイル内にローカルスコープ(local scope)が作成されます。したがって、以前のfoo.tsを次のように変更した場合(exportに注目):

export var foo = 123;

我々はもはやグローバル名前空間のfooを持っていません。これは、次のように新しいファイル bar.tsを作成することで実証できます:

var bar = foo; // ERROR: "cannot find name 'foo'"

bar.tsfoo.tsのものを使いたい場合明示的にインポートする必要があります。これを以下の更新版のbar.tsに示します:

import { foo } from "./foo";
var bar = foo; // allowed

bar.tsimportを使うと、他のファイルから取り込むことができるだけでなく、ファイルbar.tsをモジュールとして認識するので、bar.tsでの宣言は `グローバル名前空間を汚染しません。

外部モジュールを使用するTypeScriptファイルのJavaScriptへのコンパイルは、moduleというコンパイラフラグが必要です。