TypeScript(18): 命名空间
命名空间一个最明确的目的就是解决重名问题。
一、定义和使用命名空间
TypeScript 中命名空间使用 namespace 来定义,语法格式如下:
namespace SomeNameSpaceName {
export interface ISomeInterfaceName { }
export class SomeClassName { }
}
以上定义了一个命名空间 SomeNameSpaceName,如果我们需要在外部可以调用 SomeNameSpaceName 中的类和接口,则需要在类和接口添加 export 关键字。
要在另外一个命名空间调用语法格式为:
SomeNameSpaceName.SomeClassName;
如果一个命名空间在一个单独的 TypeScript 文件中,则应使用三斜杠 /// 引用它,语法格式如下:
///
以下实例演示了定义在不同文件中命名空间的使用:
IShape.ts 文件代码:
namespace Drawing {
export interface IShape {
draw();
}
}
Circle.ts 文件代码:
///namespace Drawing { export class Circle implements IShape { public draw() { console.log("Circle is drawn"); } } }
TestShape.ts 文件代码:
////// function drawAllShapes(shape:Drawing.IShape) { shape.draw(); } drawAllShapes(new Drawing.Circle());
使用 tsc 命令编译以上代码:
tsc --out app.js TestShape.ts
得到以下 JavaScript 代码:
///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 = {})); /// 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 = {})); /// /// /// 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 Runoob { export namespace invoiceApp { export class Invoice { public calculateDiscount(price: number) { return price * .40; } } } }
InvoiceTest.ts 文件代码:
///var invoice = new Runoob.invoiceApp.Invoice(); console.log(invoice.calculateDiscount(500));
使用 tsc 命令编译以上代码:
tsc --out app.js InvoiceTest.ts
得到以下 JavaScript 代码:
var Runoob; (function (Runoob) { var invoiceApp; (function (invoiceApp) { var Invoice = /** @class */ (function () { function Invoice() { } Invoice.prototype.calculateDiscount = function (price) { return price * .40; }; return Invoice; }()); invoiceApp.Invoice = Invoice; })(invoiceApp = Runoob.invoiceApp || (Runoob.invoiceApp = {})); })(Runoob || (Runoob = {})); ///var invoice = new Runoob.invoiceApp.Invoice(); console.log(invoice.calculateDiscount(500));
使用 node 命令查看输出结果为:
$ node app.js 200
posted on 2020-06-26 08:24 springsnow 阅读(200) 评论(0) 编辑 收藏 举报