От автора: пространство имен — это способ логически сгруппировать соответствующий код. Эта функция встроена в TypeScript, в отличие от JavaScript, где объявления переменных переходят в глобальную область видимости, и если множественные файлы JavaScript используются внутри одного и того же проекта, то возникает возможность перезаписывания или искажения тех же переменных, что приведёт к «глобальной проблеме засорения пространства имён» в JavaScript.
Определение пространства имён
Определение пространства имён начинается с ключевого слова namespace, после которого следует имя пространства имён, как это показано ниже:
1 2 3 4 |
namespace SomeNameSpaceName { export interface ISomeInterfaceName { } export class SomeClassName { } } |
Классы или интерфейсы, к которым нужно получать доступ из-за пределов пространства имён, нужно отметить ключевым словом export. Для того, чтобы получить доступ к классу или интерфейсу в другом пространстве имён, нам нужен следующий синтаксис:
1 2 |
namespaceName.className SomeNameSpaceName.SomeClassName; |
Если первое пространство имён находится в отдельном файле TypeScript, тогда на него нужно ссылаться с помощью тройной косой черты ссылочного синтаксиса.
1 |
/// <reference path = "SomeFileName.ts" /> |
Следующая программа демонстрирует использование пространства имён:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
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()); } } } |
Вышеуказанный код может быть скомпилирован и выполнен при помощи следующей команды:
1 2 3 |
tsc --out app.js TestShape.ts node app.js |
После компиляции мы получим следующий код JavaScript (app.js).
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
//Сгенерировано посредством 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()); |
После того, как вышеприведённый код был скомпилирован и выполнен, мы получаем такой результат:
1 2 |
Circle is drawn Triangle is drawn |
Вложённые пространства имён
Вы можете определить одно пространство имён внутри другого пространства имён, как это показано в следующем примере:
1 2 3 4 5 |
namespace namespace_name1 { export namespace namespace_name2 { export class class_name { } } } |
Чтобы получить доступ к членам вложённых пространств имён, используйте оператор dot (.), как показано ниже:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
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)); |
Вышеуказанный код может быть скомпилирован и выполнен при помощи следующей команды:
1 2 |
tsc --out app.js InvoiceTest.ts node app.js |
После компиляции мы получим следующий код JavaScript (app.js).
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
//Сгенерировано посредством 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
Источник: //www.tutorialspoint.com/
Редакция: Команда webformyself.