44

私は Typescript 言語仕様を読むのに時間を費やしましたが、内部モジュールと外部モジュールの違いについて多少混乱しています。仕様から直接引用した説明を次に示します。

内部モジュール (セクション 9.2.2) は、他のモジュール (グローバル モジュールと外部モジュールを含む) のローカルまたはエクスポートされたメンバーです。内部モジュールは、名前と本体を指定する ModuleDeclarations を使用して宣言されます。複数の識別子を持つ名前パスは、ネストされた一連の内部モジュール宣言と同等です。

外部モジュール (セクション 9.4) は、外部モジュール名を使用して参照される個別にロードされるコード本体です。外部モジュールは、少なくとも 1 つのインポートまたはエクスポート宣言を含む個別のソース ファイルとして記述されます。さらに、外部モジュールは、外部モジュール名を文字列リテラルとして直接指定するグローバル モジュールで AmbientModuleDeclarations を使用して宣言できます。これについては、セクション 0 で詳しく説明します。

私が理解していることから、外部モジュールは、型や変数のセットを単にエクスポートするモジュール定義を囲むことなく、typescript ファイルに対応していると思います。別の typescript ファイルから、 foo.tsに外部モジュールを簡単にインポートできます。import foo = module("foo");

誰かが外部モジュールと内部モジュールの境界を説明できますか?

4

4 に答える 4

26

仕様のセクション 9.3 および 9.4 では、これについてより明確に説明しています。これらのセクションで示した例のいくつかをここで再現します。

外部モジュール

次のコードが にあるとしmain.tsます。

import log = module("log");
log.message("hello");

このファイルは、エクスポートlogによって定義された外部モジュールを参照します。log.ts

export function message(s: string) { 
  console.log(s); 
}

どこにもキーワードlog.tsを使用していないことに注意してください。moduleで物をエクスポートするだけexportです。

内部モジュール

このファイルには 2 つの内部モジュールX.Y.Z.

module A.B.C { 
  import XYZ = X.Y.Z; 
  export function ping(x: number) { 
    if (x > 0) XYZ.pong(x – 1); 
  }
} 
module X.Y.Z { 
  import ABC = A.B.C; 
  export function pong(x: number) { 
    if (x > 0) ABC.ping(x – 1); 
  } 
}

これらは (ほとんど) 外部モジュールのように動作しますが、1 つのファイルに含まれているため、それらを使用するために外部ファイルを参照する必要はありません。moduleそれらは定義時にブロック内に含まれている必要があります。

于 2012-10-11T14:33:04.660 に答える
7

Anders のプレゼンテーション: http://channel9.msdn.com/posts/Anders-Hejlsberg-Introducing-TypeScript (34:40) および Typescript のドキュメントによると、外部モジュールは最上位の AMD (Asynchronous Model Definition) またはCommonJS.

外部モジュールは、モジュール定義の内部ステートメントを隠し、宣言された変数に関連付けられたメソッドとパラメーターのみを表示するという意味で便利です。

ファイルに配置されたメソッドMainが定義されたクラスがあるとします。クラスの内部メソッドは、ソース js ファイルの先頭にあるファイルを次のようにインポートする場合にのみ表示されます。このようにして、コンパイラは実行時にすべての js ファイルのトラバーサルを排除します。logtransfer.jsMaintransfer.js///<reference path="transfer.js"/>

これは、外部モジュールを使用する大きな利点です。もう 1 つは、通常のトップダウン JavaScript フローでメソッド呼び出しよりも後で定義される外部メソッドまたはクラスを参照しようとしている場合です。外部モジュールを使用すると、参照されるクラスはメソッド呼び出し時にのみインスタンス化されます。

于 2012-10-11T14:49:17.750 に答える
2

内部モジュール:

  1. typescritp ファイル内でモジュールを定義できます。
  2. モジュール内で定義されたすべての変数は、モジュールにスコープされ、グローバル スコープから削除されます。
  3. typescript ファイルをコンパイルすると、モジュールは名前空間のようなオブジェクトを形成するために必要に応じてネストする変数に変換されます。モジュール内で定義されたクラスは、IIFE (Immediately Invoked Function Expression) を使用してきちんと分離されていることに注意してください。
  4. 以下のコードは、MyClass 変数のスコープが MyInternalModule モジュールであることを示しています。モジュールの外部からアクセスすることはできないため、コードの最終行に MyClass という名前が見つからないというエラーが表示されます。
  5. export キーワードを使用して、モジュール外の変数にアクセスできます。
  6. 内部モジュールを拡張し、ファイル間で共有し、トリプル スラッシュ構文を使用して参照することもできます。( /// )

例：

module MyInternalModule{  
    class MyClass{               //if We write export keyword before the MyClass then last line works fine
        constructor (
            public height: number, 
            public width: number) {
    }
    }                   
    //working properly
    var obj1 = new MyClass(10, 4);
}

// it wont work //Because the out of the scope
var obj2 = new MyInternalModule.MyClass(10,4) //shows error: can not find name MyClass

Typescript のコンパイル済みバージョン:

var MyInternalModule;
(function (MyInternalModule) {
    var MyClass = (function () {
        function MyClass(height, width) {
            this.height = height;
            this.width = width;
        }
        return MyClass;
    })();
    //working properly
    var obj1 = new MyClass(10, 4);
})(MyInternalModule || (MyInternalModule = {}));

外部モジュール:

例：

// bootstrapper.ts file

// imports the greeter.ts file as the greeter module
import gt = module('greeter');  
export function run() {  
    var el = document.getElementById('content');
    var greeter = new gt.Greeter(el);
    greeter.start(); 
}

// greeter.ts file

// exports the entire module
export class Greeter {  
    start() {
         this.timerToken = setInterval(() => 
             this.span.innerText = 
             new Date().toUTCString(), 500);
    }
}
于 2016-09-29T07:35:15.520 に答える