Lezers zoals jij steunen MUO. Wanneer u een aankoop doet via links op onze site, kunnen we een aangesloten commissie verdienen. Lees verder.

Een naamconflict treedt op wanneer twee of meer codecomponenten dezelfde naam gebruiken voor een variabele, functie of klasse. Ze komen vaak voor bij grote projecten waar veel mensen aan dezelfde codebase werken. Ze kunnen het moeilijk maken om te bepalen welke codecomponent verantwoordelijk is voor bugs.

Met behulp van naamruimten kunt u uw code zo organiseren en beheren dat groepen gerelateerde componenten onder een gemeenschappelijke identificatie staan. Dit verkleint het risico op naamconflicten.

Een naamruimte maken

U kunt naamruimten maken in TypeScript met behulp van de naamruimte trefwoord. Volg het met een identifier om de naamruimte een naam te geven en een blok tussen accolades. De syntaxis is vergelijkbaar met degene die u zou gebruiken maak een klasse in JavaScript.

Bijvoorbeeld:

naamruimte Voorbeeld {}

Vervolgens kunt u leden van de naamruimte declareren (variabelen, functies en klassen) binnen het naamruimteblok:

instagram viewer 
naamruimte Voorbeeld {
exporterenfunctieFoo(): leegte{
troosten.log("Dit is een functie binnen de voorbeeldnaamruimte");
 }
exporterenklas Bar {
 eigendom: snaar;


constructeur(eigendom: snaar) {
dit.eigendom = eigendom;
 }
 }
exporterenconst baz = "Dit is een naamruimtevariabele"
}

In het bovenstaande voorbeeld Foo, Bar, En baz zijn lid van de Voorbeeld naamruimte. Standaard hebt u alleen toegang tot de leden van een naamruimte binnen diezelfde naamruimte. Gebruik de exporteren trefwoord om elk lid van de naamruimte daarbuiten toegankelijk te maken.

U hebt toegang tot alle openbaar beschikbare leden van een naamruimte door de lidnaam van de naamruimte aan te roepen met puntnotatie:

Voorbeeld.foo(); // Dit is een functie binnen de voorbeeldnaamruimte
const balk = nieuw Voorbeeld. Bar("snaar");
troosten.log (bar.property); // snaar
troosten.log (Voorbeeld.baz); // Dit is een naamruimtevariabele

Naamruimten nesten

Met TypeScript kunt u naamruimten in andere naamruimten nesten om een ​​hiërarchische structuur voor uw code te creëren. Het nesten van naamruimten kan de risico's van naamconflicten verder verminderen door gerelateerde naamruimten onder een gemeenschappelijke identificatie te groeperen.

Bijvoorbeeld:

naamruimte Voorbeeld {
exporterenconst eigenschap_1 = "foe";
exporterennaamruimte Bar {
exporterenconst printFoo = functie () {
troosten.log (eigenschap_1);
 };
 }


exporterennaamruimte Baz {
exporterenklas Foo {
 eigendom: snaar;
constructeur(eigendom: snaar) {
dit.eigendom = eigendom;
 }
 }
 }
}

Het bovenstaande codeblok geeft een voorbeeld van een geneste naamruimte. De Voorbeeld naamruimte is de naamruimte op het hoogste niveau, die de Bar naamruimte en de Baz naamruimte.

U hebt toegang tot de eigenschappen in een geneste naamruimte met puntnotatie die de hiërarchische structuur volgt die u hebt gemaakt.

Bijvoorbeeld:

troosten.log (Voorbeeld.property_1); // Foo
Voorbeeld. Bar.printFoo() // Foo
const foo = nieuw Voorbeeld. Baz. Foo("voorbeeld")

Deze voorbeeldcode heeft toegang tot elk lid van de naamruimte via de bovenliggende naamruimte. Rechtstreekse toegang tot een eigenschap, in plaats van via de bovenliggende naamruimte, zou een fout opleveren:

Voorbeeld.printFoo()
// fout TS2339: Eigenschap 'printFoo' bestaat niet op type 'typeof Example'

Hoewel het nesten van naamruimten u kan helpen bij het organiseren van uw code, kunnen diep geneste naamruimten het tegenovergestelde effect hebben. Diep geneste naamruimten maken uw code moeilijker te lezen en te onderhouden.

Naamruimte-aliassen

Een naamruimte-alias is een verkorte naam die wordt gegeven aan een naamruimtelid, waardoor het eenvoudiger wordt om ernaar te verwijzen.

U kunt een naamruimte-alias maken met behulp van de importeren trefwoord gevolgd door de naam die u aan de alias wilt toewijzen. Wijs vervolgens de importeren trefwoord en de aliasnaam naar een naamruimtelid.

Bijvoorbeeld:

naamruimte Auto {
exporterennaamruimte Tesla {
exporterenklas ModelX {
 creëren(): Snaar {
opbrengst`Model X Gecreëerd`
 }
 }
 }
exporterennaamruimte Toyota {
exporterenklas Camry {}
 }


exporterennaamruimte doorwaadbare plaats {
exporterenklas Mustang {}
 }
}


// De alias maken
importeren tesla = Auto. Tesla
const modelX = nieuw tesla. ModelX()
modelX.create() // Model X gemaakt

In dit voorbeeld wordt een alias gemaakt voor de Auto. Tesla naamruimte. U kunt deze alias gebruiken om toegang te krijgen tot de eigenschappen van het Tesla naamruimte, zoals de klasse ModelX, gemakkelijker.

Naamruimten gebruiken in meerdere bestanden

Om een ​​naamruimte in een ander bestand te gebruiken, moet u deze importeren. Het importeren van naamruimten is anders dan het importeren van variabelen, functies, klassen, enz. Afhankelijk van uw projecten module systeem, kunt u ze importeren met de vereisen of de importeren trefwoord.

U kunt echter alleen naamruimten importeren met behulp van de triple-slash-richtlijn, een opmerking van één regel met een XML-tag.

Bijvoorbeeld:

// main.ts
/// 
Voorbeeld.foo()

Dit voorbeeld gebruikt de triple slash-richtlijn binnen a hoofd.ts bestand. De richtlijn verwijst naar de index.ts bestand, dat de Voorbeeld naamruimte. Zonder importeren is de naamruimte alleen beschikbaar binnen hetzelfde bestand dat deze definieert.

Na verwijzing naar de index.ts bestand, heb je toegang tot het Voorbeeld naamruimte en zijn openbaar beschikbare leden. U kunt bijvoorbeeld bellen met de foe methode op de Voorbeeld naamruimte.

Zodra u meerdere bestanden gebruikt, moet u ervoor zorgen dat TypeScript alle benodigde code compileert en laadt. U kunt dit doen door uitvoer van de TypeScript-compiler samen te voegen met behulp van de outFile keuze. Hiermee worden vervolgens alle invoerbestanden gecompileerd in één enkel JavaScript-uitvoerbestand. De algemene syntaxis voor het uitvoeren van de compiler is als volgt:

tsc --outFile

Vervangen met de naam van uw doel-JavaScript-bestand. Vervangen met de naam van het TypeScript-bestand dat de triple-slash-richtlijn bevat.

Bijvoorbeeld:

tsc --outFile index.js main.ts

Met deze opdracht wordt de inhoud van het hoofd.ts bestand, samen met alle bestanden waarnaar wordt verwezen door de triple-slash-richtlijn, in de index.js bestand.

U kunt ook elk bestand afzonderlijk specificeren:

tsc --outFile

Het is belangrijk op te merken dat de triple-slash-richtlijn alleen geldig is als deze bovenaan een bestand wordt aangegeven. Als u het ergens anders probeert te gebruiken, zal TypeScript het behandelen als een gewoon commentaar van één regel zonder speciale betekenis.

Moet u naamruimten of modules gebruiken?

Hoewel naamruimten niet worden afgeschaft, wordt het vaak aanbevolen om uw code te organiseren en te beheren met behulp van ES6-modules. Modules zijn eenvoudiger te onderhouden en te beheren en u kunt ze over meerdere bestanden verdelen.

Bovendien kunt u de relaties tussen modules in termen van import en export op bestandsniveau specificeren. Naamruimten kunnen hun afhankelijkheden niet definiëren.

Uiteindelijk zal de keuze tussen naamruimten en modules afhangen van de specifieke behoeften en vereisten van uw project, aangezien beide een waardevolle manier bieden om code in TypeScript te organiseren en te beheren.