先生と生徒の会話形式で理解しよう

生徒

「TypeScriptのプログラムが大きくなってきて、コードを整理したいんです。namespaceとmoduleという言葉を聞いたのですが、何が違うんですか？」

先生

「とても大切なポイントですね。TypeScriptには、コードを整理するための『箱』のような役割として、namespace（名前空間）とmodule（モジュール）の2つが用意されています。」

生徒

「どちらも同じような役割に見えますが、どう使い分ければいいんでしょうか？」

先生

「現在の主流はmoduleですが、古いシステムではnamespaceが使われていることもあります。まずはそれぞれの特徴と、現代の推奨される書き方を詳しく解説していきましょう！」

1. モジュールと名前空間とは？

プログラミングをしていると、ソースコードの量がどんどん増えていきます。最初は1つのファイルで収まっていても、何千行、何万行となると、どこに何を書いたか分からなくなってしまいます。また、同じ「User」という名前のクラスや関数を別の場所でも使いたいとき、名前がぶつかってエラーになってしまうこともあります。

これを防ぐために、コードを機能ごとに分割して整理する仕組みが必要です。TypeScriptでは、主に「モジュール（Module）」と「名前空間（Namespace）」という2つの方法でコードを管理します。これらは、例えるなら「本棚の仕切り」や「フォルダ分け」のようなものです。

現代のTypeScript開発においては、「モジュール（Module）」を使うのが一般的です。しかし、歴史的な経緯から名前空間（Namespace）が存在しており、古いコードを読み解く際や、特定の状況では知識が必要になります。それぞれの違いをしっかりと学んでいきましょう。

2. Module（モジュール）の使い方

モジュールは、現代のJavaScriptやTypeScriptにおいて標準となっている機能です。1つのファイルがそのまま1つのモジュールとして扱われます。ファイルの中で定義した変数や関数は、そのままではそのファイルの中でしか使えません。外で使いたい場合は、明示的に「これを出しますよ！」と宣言する必要があります。

この「出す」行為をエクスポート（export）、「取り込む」行為をインポート（import）と呼びます。外部とのやり取りを明確にすることで、どのファイルがどの機能に依存しているかが一目で分かるようになります。

モジュールの具体例

まず、機能を定義するファイルを作成します。ここでは計算を行う機能を「mathUtils.ts」というファイルに作ってみましょう。


// mathUtils.ts
export const add = (a: number, b: number): number => {
    return a + b;
};

export const subtract = (a: number, b: number): number => {
    return a - b;
};

次に、この機能を使いたい別のファイル（main.ts）で、必要な機能だけを呼び出します。


// main.ts
import { add, subtract } from "./mathUtils";

console.log(add(10, 5));
console.log(subtract(10, 5));

実行結果は以下のようになります。


15
5

このように、ファイル単位で機能を独立させるのがモジュールの基本です。これにより、名前の衝突を避け、プログラムの保守性を高めることができます。

3. Namespace（名前空間）の使い方

名前空間（Namespace）は、TypeScript独自の機能で、以前は「内部モジュール」と呼ばれていました。1つのファイル内に、論理的なグループを作るために使用されます。例えば、たくさんのユーティリティ関数があるときに、それらを1つの名前空間にまとめることができます。

名前空間を使うときは namespace キーワードを使い、その中で定義したものを外で使うには export を付けます。

名前空間の具体例


namespace Validation {
    export const isString = (value: any): boolean => {
        return typeof value === 'string';
    };

    export const isNumber = (value: any): boolean => {
        return typeof value === 'number';
    };
}

// 使うときは「名前空間名.関数名」で呼び出します
console.log(Validation.isString("こんにちは"));
console.log(Validation.isNumber(123));

実行結果は以下のようになります。


true
true

名前空間は、ファイルを分けなくてもグループ化ができるという特徴がありますが、複数のファイルにまたがって同じ名前空間を定義することも可能です。しかし、これは管理が複雑になりやすいため、現在ではあまり推奨されません。

4. モジュールと名前空間の決定的な違い

初心者の方が最も迷うのが「どちらを使えばいいの？」という点です。結論から言うと、基本的にはモジュールを使ってください。 その理由はいくつかあります。

依存関係の透明性

モジュールは、ファイルの冒頭にある import 文を見るだけで、そのファイルが何に依存しているかがすぐに分かります。一方で、名前空間はグローバル（プログラムのどこからでもアクセスできる場所）に定義されることが多いため、どこで定義されたものなのかを探すのが大変になることがあります。

標準化と互換性

モジュールは「ECMAScript Module (ESM)」というJavaScriptの標準規格に基づいています。これはブラウザやNode.jsといった実行環境で共通してサポートされている仕組みです。TypeScript独自ルールである名前空間よりも、標準ルールであるモジュールを使う方が、将来的に他のライブラリやツールと連携しやすくなります。

ファイル構成の整理

モジュールを使うと、自然と「1ファイル 1役割」の設計になります。これにより、コードの再利用性が高まり、チーム開発でも競合が起きにくくなります。対して名前空間は、1つの巨大なファイルにたくさんのコードを詰め込んでしまう原因になりがちです。

特徴	Module（推奨）	Namespace
役割	ファイル単位で機能を分ける	コード内で論理的なグループを作る
呼び出し方	import / export を使う	namespaceキーワードを使う
主な用途	現代の全ての開発	古いコードの保守、レガシーな環境

5. モジュール設計のコツ：デフォルトエクスポート

モジュールを使いこなす上で知っておきたいのが export default です。これは、そのファイルから「メインの機能」を1つだけ提供するときに使います。


// MyTask.ts
export default class MyTask {
    title: string;
    constructor(title: string) {
        this.title = title;
    }
}

インポートするときは、波括弧 { } を使わずに、好きな名前で受け取ることができます。


// app.ts
import Task from "./MyTask";

const myTodo = new Task("プログラミングの学習");
console.log(myTodo.title);

複数の機能を提供するときは export、1つの主要なクラスや関数を提供するときは export default と使い分けることで、より読みやすいコードになります。

6. なぜ名前空間はまだ存在するのか？

「そんなにモジュールが良いなら、なぜ名前空間があるの？」と不思議に思うかもしれません。名前空間は、JavaScriptに「モジュール」という概念がまだ普及していなかった時代に、TypeScriptが独自に提供した整理術でした。昔のWebサイト開発では、HTMLに <script> タグをたくさん並べて読み込んでいたため、名前が重ならないようにする工夫が必要だったのです。

現在でも、非常に大規模なライブラリの型定義ファイル（.d.tsファイル）などで、内部的な構造を定義するために使われることがありますが、皆さんが新しくアプリケーションを作る際には、迷わず「モジュール」を選択してください。

7. プログラミング未経験者へのアドバイス

ここまでの説明で「インポート」や「エクスポート」といった言葉が出てきましたが、これらは現実世界で例えると「道具箱」と「作業場」の関係に似ています。

モジュール（Module）は、必要な道具が入った専用の小さなケースです。ノコギリが必要なら「工具箱Aからノコギリを持ってくる」と指定します。これがインポートです。自分の作業場で何を使っているか明確なので、机の上が散らかりません。

一方、名前空間（Namespace）は、大きな部屋の隅に引かれた「境界線」のようなものです。「ここからあそこまでは大工さんのエリア」と決めるだけなので、同じ部屋にいる以上、誰が何を使っているか混乱しやすいのです。

最初は少し面倒に感じるかもしれませんが、小さな単位でファイルを作って、それを import して使う習慣をつけることが、TypeScriptマスターへの第一歩です。エラーが出たときは、「ファイルの場所（パス）が合っているか」「exportを忘れていないか」を確認してみましょう。それだけで解決することがほとんどです。