TypeScript 中的内部模块和外部模块有什么区别?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12841557/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What's the difference between internal and external modules in TypeScript?
提问by Valentin
I have spent some time reading the Typescript language specification and am somewhat confused about the difference between internaland externalmodules. Here is the description taken directly from the specification:
我花了一些时间阅读 Typescript 语言规范,但对内部模块和外部模块之间的区别有些困惑。以下是直接取自规范的描述:
Internal modules (section 9.2.2) are local or exported members of other modules (including the global module and external modules). Internal modules are declared using ModuleDeclarations that specify their name and body. A name path with more than one identifier is equivalent to a series of nested internal module declarations.
External modules (section 9.4) are separately loaded bodies of code referenced using external module names. An external module is written as a separate source file that contains at least one import or export declaration. In addition, external modules can be declared using AmbientModuleDeclarations in the global module that directly specify the external module names as string literals. This is described further in section 0.
内部模块(第 9.2.2 节)是其他模块(包括全局模块和外部模块)的本地或导出成员。内部模块使用指定其名称和主体的 ModuleDeclarations 进行声明。具有多个标识符的名称路径等效于一系列嵌套的内部模块声明。
外部模块(第 9.4 节)是使用外部模块名称引用的单独加载的代码体。外部模块被编写为包含至少一个导入或导出声明的单独源文件。此外,可以使用全局模块中的 AmbientModuleDeclarations 声明外部模块,直接将外部模块名称指定为字符串文字。这将在第 0 节中进一步描述。
From what I've understood I think that external modules correspond to typescript files without enclosing module definitions that simply export a set of types and/or variables. From another typescript file I can simple import an external module in foo.tswith import foo = module("foo");
根据我的理解,我认为外部模块对应于 typescript 文件,而没有包含简单地导出一组类型和/或变量的模块定义。从另一个打字稿文件,我可以简单的导入在外部模块foo.ts与import foo = module("foo");
Can somebody explain to me the destinction between external and internal modules?
有人可以向我解释外部模块和内部模块之间的去向吗?
采纳答案by Peter Olson
Sections 9.3 and 9.4 of the specification explain this more clearly. I'll reproduce here some of the examples given in those sections.
规范的 9.3 和 9.4 节更清楚地解释了这一点。我将在此处重现这些部分中给出的一些示例。
External modules
外部模块
Suppose the following code is in main.ts.
假设以下代码在main.ts.
import log = module("log");
log.message("hello");
This file references an external module log, defined by whatever log.tsexports.
该文件引用了一个外部模块log,由任何log.ts导出定义。
export function message(s: string) {
console.log(s);
}
Notice that log.tsdoesn't use the modulekeyword anywhere. It just exports things with export.
请注意,log.ts不要在module任何地方使用关键字。它只是用export.
Internal modules
内部模块
This file has two internal modules, X.Y.Z.
这个文件有两个内部模块,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);
}
}
These behave (mostly) like external modules, but they are contained in one file and you don't have to reference any outside files to use them. They have to be contained inside of a moduleblock when they are defined.
它们的行为(大部分)类似于外部模块,但它们包含在一个文件中,您无需引用任何外部文件即可使用它们。它们module在定义时必须包含在块内。
回答by Endre Simo
According to Anders presentations: http://channel9.msdn.com/posts/Anders-Hejlsberg-Introducing-TypeScript(34:40) and Typescript documentation, the external modules are modules which are based on top AMD (Asynchronous Model Definition) or CommonJS.
根据 Anders 的介绍:http://channel9.msdn.com/posts/Anders-Hejlsberg-Introducing-TypeScript (34:40) 和 Typescript 文档,外部模块是基于顶级 AMD(异步模型定义)或通用JS。
External modules are useful in sense they hide the internal statements of the module definitions and show only the methods and parameters associated to the declared variable.
外部模块在某种意义上很有用,它们隐藏了模块定义的内部语句,仅显示与声明的变量关联的方法和参数。
Suppose you have a Mainclass with a defined logmethod placed in a transfer.jsfile. The internal methods of the Mainclass are only visible when you are importing the transfer.jsfile at the top of the source js file as so: ///<reference path="transfer.js"/>. This way the compiler eliminates the traversal of all js files at runtime.
假设您在文件中放置了一个Main带有已定义log方法的类transfer.js。类的内部方法Main仅在您transfer.js在源 js 文件的顶部导入文件时才可见:///<reference path="transfer.js"/>. 这样编译器就消除了运行时对所有js文件的遍历。
This is a huge benefit of using external modules. Another one is when you are trying to reference an external method or class which in the normal top-down javascript flow is defined later than the method invocation. Using external modules the referenced class is instantiated only on method invocation.
这是使用外部模块的巨大好处。另一种情况是当您尝试引用外部方法或类时,该方法或类在正常的自上而下的 javascript 流中定义晚于方法调用。使用外部模块,引用的类仅在方法调用时实例化。
回答by vsjondhale
Internal Module:
内部模块:
- You can define modules within your typescritp files.
- All variables defined within the module are scoped to the module and removed from the global scope.
- When you compile your typescript files your modules are converted into variables that nest as necessary to form namespace-like objects. Notice that the class defined within the module is neatly isolated using an IIFE (Immediately Invoked Function Expression).
- The code below shows that the MyClass variable scoped to the MyInternalModule module. They cannot be accessed outside of the module that's why the final line of the code shows the error can not find name MyClass.
- You can access the variable outside the module using the export keyword.
- You can also extend internal modules, share them across files, and reference them using the triple slash syntax.( /// )
- 您可以在 typecritp 文件中定义模块。
- 模块中定义的所有变量都限定在模块范围内,并从全局范围中删除。
- 当您编译打字稿文件时,您的模块将转换为变量,这些变量根据需要嵌套以形成类似命名空间的对象。请注意,模块中定义的类使用 IIFE(立即调用函数表达式)巧妙地隔离。
- 下面的代码显示了 MyClass 变量的作用域为 MyInternalModule 模块。它们无法在模块外部访问,这就是为什么代码的最后一行显示错误找不到名称 MyClass。
- 您可以使用 export 关键字访问模块外的变量。
- 您还可以扩展内部模块,跨文件共享它们,并使用三斜杠语法引用它们。( /// )
Example:
示例:
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
Compiled Version of 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 = {}));
External Module:
外部模块:
Example:
示例:
// 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);
}
}

