TypeScript 命名空间
TypeScript 命名空间
命名空间一个最明确的目的就是解决重名问题。
命名空间定义了标识符的可见范围，一个标识符可在多个名字空间中定义，它在不同名字空间中的含义是互不相干的。这样，在一个新的名字空间中可定义任何标识符，它们不会与任何已有的标识符发生冲突，因为已有的定义都处于其他名字空间中。
TypeScript 中命名空间使用 namespace 来定义，语法格式如下：
namespace
SomeNameSpaceName
{
export
interface
ISomeInterfaceName
{
}
export
class
SomeClassName
{
}
}
以上定义了一个命名空间 SomeNameSpaceName，如果我们需要在外部可以调用 SomeNameSpaceName 中的类和接口，则需要在类和接口添加 export 关键字。
要在另外一个命名空间调用语法格式为：
SomeNameSpaceName.SomeClassName;
如果一个命名空间在一个单独的 TypeScript 文件中，则应使用三斜杠 /// 引用它，语法格式如下：
/// <reference path = "SomeFileName.ts" />
以下实例演示了命名空间的使用，定义在不同文件中：
IShape.ts 文件代码：
namespace
Drawing
{
export
interface
IShape
{
draw();
}
}
Circle.ts 文件代码：
/// <reference path = "IShape.ts" />
namespace
Drawing
{
export
class
Circle
implements
IShape
{
public
draw()
{
console.log("Circle is drawn");
}
}
}
Triangle.ts 文件代码：
/// <reference path = "IShape.ts" />
namespace
Drawing
{
export
class
Triangle
implements
IShape
{
public
draw()
{
console.log("Triangle is drawn");
}
}
}
TestShape.ts 文件代码：
/// <reference path = "IShape.ts" />
/// <reference path = "Circle.ts" />
/// <reference path = "Triangle.ts" />
function
drawAllShapes(shape:Drawing.IShape)
{
shape.draw();
}
drawAllShapes(new
Drawing.Circle());
drawAllShapes(new
Drawing.Triangle());
使用 tsc 命令编译以上代码：
tsc --out app.js TestShape.ts
得到以下 JavaScript 代码：
JavaScript
/// <reference path = "IShape.ts" />
var
Drawing;
(function
(Drawing)
{
var
Circle = /** @class */
(function
()
{
function
Circle()
{
}
Circle.prototype.draw = function
()
{
console.log("Circle is drawn");
};
return
Circle;
}());
Drawing.Circle = Circle;
})(Drawing || (Drawing = {}));
/// <reference path = "IShape.ts" />
var
Drawing;
(function
(Drawing)
{
var
Triangle = /** @class */
(function
()
{
function
Triangle()
{
}
Triangle.prototype.draw = function
()
{
console.log("Triangle is drawn");
};
return
Triangle;
}());
Drawing.Triangle = Triangle;
})(Drawing || (Drawing = {}));
/// <reference path = "IShape.ts" />
/// <reference path = "Circle.ts" />
/// <reference path = "Triangle.ts" />
function
drawAllShapes(shape)
{
shape.draw();
}
drawAllShapes(new
Drawing.Circle());
drawAllShapes(new
Drawing.Triangle());
使用 node 命令查看输出结果为：
$ node app.js
Circle is drawn
Triangle is drawn
嵌套命名空间
命名空间支持嵌套，即你可以将命名空间定义在另外一个命名空间里头。
namespace
namespace_name1
{
export
namespace
namespace_name2
{
export
class
class_name
{
}
}
}
成员的访问使用点号 . 来实现，如下实例：
Invoice.ts 文件代码：
namespace
CodeWhy
{
export
namespace
invoiceApp
{
export
class
Invoice
{
public
calculateDiscount(price: number)
{
return
price * .40;
}
}
}
}
InvoiceTest.ts 文件代码：
/// <reference path = "Invoice.ts" />
var
invoice = new
CodeWhy.invoiceApp.Invoice();
console.log(invoice.calculateDiscount(500));
使用 tsc 命令编译以上代码：
tsc --out app.js InvoiceTest.ts
得到以下 JavaScript 代码：
JavaScript
var
CodeWhy;
(function
(CodeWhy)
{
var
invoiceApp;
(function
(invoiceApp)
{
var
Invoice = /** @class */
(function
()
{
function
Invoice()
{
}
Invoice.prototype.calculateDiscount = function
(price)
{
return
price * .40;
};
return
Invoice;
}());
invoiceApp.Invoice = Invoice;
})(invoiceApp = CodeWhy.invoiceApp || (CodeWhy.invoiceApp = {}));
})(CodeWhy || (CodeWhy = {}));
/// <reference path = "Invoice.ts" />
var
invoice = new
CodeWhy.invoiceApp.Invoice();
console.log(invoice.calculateDiscount(500));
使用 node 命令查看输出结果为：
$ node app.js
200