TypeScript: spazi dei nomi

Uno spazio dei nomi è un modo per raggruppare logicamente il codice correlato. Questo è integrato in TypeScript a differenza di JavaScript in cui le dichiarazioni delle variabili rientrano in un ambito globale e se vengono utilizzati più file JavaScript all'interno dello stesso progetto ci sarà la possibilità di sovrascrivere o interpretare erroneamente le stesse variabili, il che porterà al "problema di inquinamento dello spazio dei nomi globale" in JavaScript.

Definizione di uno spazio dei nomi

Una definizione di spazio dei nomi inizia con la parola chiave namespace seguito dal nome dello spazio dei nomi come segue:

namespace SomeNameSpaceName { 
   export interface ISomeInterfaceName {      }  
   export class SomeClassName {      }  
}

Le classi o le interfacce a cui si dovrebbe accedere al di fuori dello spazio dei nomi dovrebbero essere contrassegnate con la parola chiave export.

Per accedere alla classe o all'interfaccia in un altro spazio dei nomi, la sintassi sarà namespaceName.className

SomeNameSpaceName.SomeClassName;

Se il primo spazio dei nomi si trova in un file TypeScript separato, è necessario fare riferimento ad esso utilizzando la sintassi di riferimento con la tripla barra.

/// <reference path = "SomeFileName.ts" />

Il seguente programma dimostra l'uso degli spazi dei nomi:

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());
      }
   }
}

Il codice sopra può essere compilato ed eseguito utilizzando il seguente comando:

tsc --out app.js TestShape.ts  

node app.js

Durante la compilazione, genererà il seguente codice 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());

Quando il codice precedente viene compilato ed eseguito, produce il seguente risultato:

Circle is drawn 
Triangle is drawn

Spazi dei nomi annidati

È possibile definire uno spazio dei nomi all'interno di un altro spazio dei nomi come segue:

namespace namespace_name1 { 
   export namespace namespace_name2 {
      export class class_name {    } 
   } 
}

È possibile accedere ai membri dello spazio dei nomi nidificato utilizzando l'operatore punto (.) Come segue:

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));