命名空间是对相关代码进行逻辑分组的一种方法。这是内置在TypeScript中的,而JavaScript中的变量声明进入了全局范围,并且如果在同一项目中使用多个JavaScript文件,则有可能会覆盖或错误解释相同的变量,从而导致“全局名称空间污染问题”。 JavaScript。
定义命名空间
命名空间定义以关键字命名空间开头,后跟命名空间名称,如下所示:
namespace SomeNameSpaceName { export interface ISomeInterfaceName { } export class SomeClassName { } }
应该在名称空间之外访问的类或接口应该用关键字export标记。
要访问另一个名称空间中的类或接口,语法将为namespaceName.className
SomeNameSpaceName.SomeClassName;
如果第一个名称空间在单独的TypeScript文件中,则应使用三斜杠引用语法对其进行引用。
/// <reference path = "SomeFileName.ts" />
以下程序演示了名称空间的使用-
FileName :IShape.ts ---------- namespace Drawing { export interface IShape { draw(); } } FileName :Circle.ts ---------- /// <reference path = "IShape.ts" /> namespace Drawing { export class Circle implements IShape { public draw() { console.log("Circle is drawn"); } FileName :Triangle.ts ---------- /// <reference path = "IShape.ts" /> namespace Drawing { export class Triangle implements IShape { public draw() { console.log("Triangle is drawn"); } } FileName : 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 --out app.js TestShape.ts node app.js
编译时,它将生成以下JavaScript代码(app.js)。
//Generated by typescript 1.8.10 /// <reference path = "IShape.ts" /> var Drawing; (function (Drawing) { var Circle = (function () { function Circle() { } Circle.prototype.draw = function () { console.log("Cirlce is drawn"); }; return Circle; }()); Drawing.Circle = Circle; })(Drawing || (Drawing = {})); /// <reference path = "IShape.ts" /> var Drawing; (function (Drawing) { var Triangle = (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());
编译并执行上述代码后,将产生以下结果-
Circle is drawn Triangle is drawn
嵌套命名空间
您可以在另一个名称空间内定义一个名称空间,如下所示:
namespace namespace_name1 { export namespace namespace_name2 { export class class_name { } } }
您可以通过使用点(.)运算符来访问嵌套名称空间的成员,如下所示:
FileName : Invoice.ts namespace tutorialPoint { export namespace invoiceApp { export class Invoice { public calculateDiscount(price: number) { return price * .40; } } } } FileName: InvoiceTest.ts /// <reference path = "Invoice.ts" /> var invoice = new tutorialPoint.invoiceApp.Invoice(); console.log(invoice.calculateDiscount(500));
上面的代码可以使用以下命令编译和执行-
tsc --out app.js InvoiceTest.ts node app.js
编译时,它将生成以下JavaScript代码(app.js)。
//Generated by typescript 1.8.10 var tutorialPoint; (function (tutorialPoint) { var invoiceApp; (function (invoiceApp) { var Invoice = (function () { function Invoice() { } Invoice.prototype.calculateDiscount = function (price) { return price * .40; }; return Invoice; }()); invoiceApp.Invoice = Invoice; })(invoiceApp = tutorialPoint.invoiceApp || (tutorialPoint.invoiceApp = {})); })(tutorialPoint || (tutorialPoint = {})); /// <reference path = "Invoice.ts" /> var invoice = new tutorialPoint.invoiceApp.Invoice(); console.log(invoice.calculateDiscount(500));
编译并执行上述代码后,将产生以下结果-
200