Microsoft geeft het volgende voorbeeld van waar decorators in beeld komen:
class Person {
name: string;
constructor(name: string) {
this.name = name;
}
greet() {
console.log("LOG: Entering method.");
console.log(`Hello, my name is ${this.name}.`);
console.log("LOG: Methode verlaten.")
}
}
Hier ziet u meerdere console.log-aanroepen die het "greet"-lid van de "Person"-klasse helpen om een gepaste begroeting uit te voeren. Als u denkt dat u dit patroon van `console.log`-opdrachten elders kunt gebruiken, kunt u nu een functie maken die u overal in uw code kunt aanroepen. Dat is een decorator. In dit geval zegt Microsoft dat de gemaakte functie er ongeveer zo uit zou kunnen zien: function loggedMethod(originalMethod: any", _context: any) { function replacementMethod(this: any, ...args: any[]) { console.log("LOG: Entering method.") const result = originalMethod.call(this, ...args); console.log("LOG: Exiting method.") return result; } return replacementMethod; }
Hier ziet u hoe een functie "loggedMethod" wordt aangemaakt. Deze functie zet de console.log-aanroepen van de originele code om in een functie die u weer in de code kunt invoegen. Wanneer u uw code uitvoert, bevat deze de naam van elke klasse of methode die u "versiert" met uw nieuwe functie.
Deze functie kan behoorlijk complex worden, vooral wanneer u typen en context in uw decorators introduceert. Het belangrijkste is dat je je decorators overal in je code kunt aanroepen, waarbij Microsoft aangeeft dat ze veel vaker gebruikt zullen worden dan dat ze geschreven zijn. Er zijn echter ook enkele beperkingen aan decorators. TypeScript 5.0 staat bijvoorbeeld nog niet toe dat je de typen die aan klassen en methodesignaturen zijn toegewezen, wijzigt of beperkt.
2 – Verbeterd gebruik van Enums
In TypeScript zijn Enums constructies waarmee je een set benoemde constanten kunt maken. Deze constanten worden vervolgens doorgegeven aan een functie, waarbij de toevoegingen van TypeScript 5.0 ze flexibeler maken dan voorheen.
Dit is het duidelijkst te zien bij het genereren van fouten.
Bijvoorbeeld, Kinsta geeft het volgende korte voorbeeld:
enum Color {
Red,
Green,
Blue,
}
function getColorName(colorLevel: Kleur) {
return colorLevel;
}
console.log(getColorName(1));
Voorheen resulteerde het doorgeven van een onjuist niveaunummer aan een functie niet in een foutmelding van TypeScript. De functie probeerde gewoon te draaien met het onjuiste nummer. Nu geeft TypeScript direct een foutmelding weer, waardoor je snel eventuele fouten of problemen in je code kunt opsporen.
Bovendien zijn Enums uitgebreid, waardoor ze allemaal "union Enums" zijn geworden. Elk berekend lid van de Enum krijgt een uniek type, waardoor je die leden elders in je code als typen kunt gebruiken.
3 – Infrastructuurwijzigingen en -optimalisaties
De meest significante verbeteringen in TypeScript 5.0 hebben wellicht betrekking op de infrastructuur die de taal ondersteunt. Zoals Microsoft beloofde, is het veel sneller, met de volgende verbeteringen die de bouwtijd verkorten:
- Playwright – Bouwtijd is met 87% verbeterd
- MUI – Bouwtijd is 90% sneller
- VS Code – Bouwtijd is met 80% verbeterd
- Outlook Web – Bouwtijd is met 82% verbeterd
Deze verbeteringen zijn vrijwel overal zichtbaar. De TypeScript-compiler is bijvoorbeeld nu 87% sneller bij het opstarten en heeft ook een 87% snellere zelfcompilatietijd. De meeste van deze optimalisaties zijn het resultaat van Microsofts overstap van namespaces naar modules binnen de taal. Dit biedt programmeurs de mogelijkheid om een modulaire – en efficiëntere – infrastructuur te creëren en tegelijkertijd modernere buildtools te integreren. Andere aanpassingen omvatten het verminderen van de hoeveelheid data die in de compiler wordt opgeslagen, wat waarschijnlijk de snellere opstart- en zelfcompilatietijden verklaart. Uniformiteit tussen objecttypen wordt verder bevorderd, zowel door een betere balans in geheugengebruik tussen objecten als door de vermindering van polymorfe bewerkingen. Met andere woorden, er zullen minder bewerkingen worden gedeclareerd zonder implementatie binnen een bovenliggende klasse, waardoor het aantal "onvolledige" bewerkingen in uw code aanzienlijk wordt verminderd.
4 – Constante typeparameters
Een van de meest voorkomende problemen die door TypeScript-gebruikers worden aangekaart, is dat het vaak te vaag was bij het afleiden van een object. TypeScript deed dit meestal om de mogelijkheid van latere mutaties te creëren, maar het resultaat was dat gebruikers minder controle hadden over wat hun code deed. Als u ervoor wilde zorgen dat een specifiek type werd gebruikt, merkte u mogelijk dat TypeScript niet aan uw gewenste inferentie voldeed. Er werd om specificiteit gevraagd, en Microsoft leverde dit via de nieuwe modifier "const". U kunt deze modifier toevoegen aan een typeparameterdeclaratie, waardoor de inferentie "const" de standaard wordt voor al het gebruik van dat type. Cruciaal is dat de modifier niet zomaar alle veranderlijke waarden die u gebruikt afwijst, wat betekent dat een beperking van het veranderlijke type nog steeds onverwachte resultaten kan opleveren.
5 – Implementatie van aanpassingsvlaggen
Nu JavaScript in staat is om "hybride" resolutieregels te modelleren, zult u wellicht merken dat sommige tools die u gebruikt verschillen in de mate waarin ze TypeScript ondersteunen. Met TypeScript 5.0 biedt Microsoft u een manier om vlaggen in te stellen waarmee een functie kan worden in- of uitgeschakeld, afhankelijk van of deze werkt met uw specifieke configuratie. -->
Hieronder volgen een paar voorbeelden:
allowImportingTsExtensions
Deze functie maakt het normaal gesproken mogelijk dat TypeScript-bestanden elkaar kunnen importeren, zolang ze maar een geschikte extensie hebben, zoals .ts of .tsx.
Het probleem is dat deze importpaden mogelijk niet oplosbaar zijn in een JavaScript-uitvoerbestand wanneer u het programma uitvoert. Met "--noEmit" en "--emitDeclarationOnly" kunt u nu bepalen wanneer de vlag "allowImportingTsExtensions" is ingeschakeld, waardoor de kans op runtime-importproblemen wordt beperkt.
customConditions
Met de opdracht "customConditions" kunt u TypeScript nu laten verwijzen naar een lijst met voorwaarden waaraan moet worden voldaan wanneer het platform een import- of exportveld van een package.json oplost. De voorwaarden die u opgeeft, worden eenvoudigweg toegevoegd aan de standaardvoorwaarden die uw resolver gebruikt, waardoor u voorwaarden kunt specificeren die niet automatisch worden gecontroleerd. Er zijn nog veel meer voorbeelden, en Microsofts Developer Blog voor TypeScript 5.0 gaat hier dieper op in. U kunt bijvoorbeeld ook verschillende nieuwe vlaggen doorgeven in de --build-modus, waaronder de volgende:
--sourceMap--declaration--declarationMap--inlineSourceMap--emitDeclarationOnly
Deze commandoʼs maken het gemakkelijker om onderdelen van uw build aan te passen en voorwaarden in te stellen voor builds die mogelijk verschillende productie- of ontwikkelomgevingen implementeren. Uiteindelijk geeft TypeScript 5.0 je meer controle door het gebruik van flexibelere aanpassingsvlaggen in je code.
6 – Wijzigingen in runtimevereisten
Met de introductie van TypeScript 5.0 zijn er enkele wijzigingen in je runtimevereisten. Het platform gebruikt nu ECMAScript 2018, waarbij de minimale engine-vereiste is ingesteld op 12.20. Je moet upgraden naar deze versie – vooral als je Node.js gebruikt – als je wilt profiteren van de nieuwe functies van TypeScript 5.0. Het is ook belangrijk om te weten dat Microsoft een aantal interfaces heeft verwijderd die als verouderd of overbodig worden beschouwd. Daarnaast zijn er diverse wijzigingen in lib.dts doorgevoerd die van invloed kunnen zijn op de werking van code die in een eerdere versie van TypeScript is gemaakt. Sommige eigenschappen zijn bijvoorbeeld omgezet in numerieke letterlijke typen in plaats van getallen, en u zult merken dat methoden voor knippen, kopiëren en plakken naar andere interfaces zijn verplaatst.
7 – De moduleResolution bundler
Hoewel geïntroduceerd in TypeScript 4.7, heeft de "moduleResolution bundler" enkele kleine wijzigingen ondergaan in versie 5.0 van het platform. Het modelleert nog steeds hoe een bundler werkt en ondersteunt een hybride opzoekstrategie, indien nodig. Dat stelt je in staat om de opdracht te gebruiken voor moderne bundlers, zoals Webpack, Parcel en Vite, en bevordert tevens de compatibiliteit met elke bundler die gebruikmaakt van hybride lookup. Met TypeScript 5.0 introduceert Microsoft meer flexibiliteit in zijn module-resolutiestrategie. Hiermee kun je de resolutieparameters van TypeScript aanpassen, waardoor de compatibiliteit van het platform met verschillende runtimes en bundlers wordt vergroot. Bovendien kan de opdracht "moduleResolution bundler" u nu helpen bij het oplossen van imports en exports met betrekking tot package.json.
8 – Ondersteuning voor "export type *"
Met TypeScript 3.8 introduceerde Microsoft de mogelijkheid om alleen type-imports uit te voeren. Maar de gecreëerde syntax bood geen ondersteuning voor exports – een duidelijke omissie die is opgelost met TypeScript 5.0.
U kunt nu een type exporteren vanuit een module of een type exporteren als een namespace vanuit een module. De wijziging brengt het exporteren van alleen typen op gelijke voet met het importeren, waardoor er meer flexibiliteit is bij het exporteren van modules in de nieuwste versie van het platform.
Ontdek wat Microsoft te bieden heeft met TypeScript 5.0
De belangrijkste conclusie is dat Microsoft er alles aan heeft gedaan om TypeScript aantrekkelijker te maken voor programmeurs. De snelheidsverbeteringen zijn een welkome – en broodnodige – reeks optimalisaties die het platform gebruiksvriendelijker maken. Verdere snelheidsverbeteringen kunnen het gevolg zijn van de volledige implementatie van decorators, waarmee je code kunt hergebruiken in plaats van deze telkens opnieuw te typen. Andere wijzigingen – zoals de introductie van nieuwe vlaggen – zijn bedoeld om je meer controle te geven over hoe je code werkt of, in het geval van "const"-parameters, wat je code aanroept. Experimenteren kan nodig zijn. Bovendien zul je wellicht merken dat een aantal van de wijzigingen van invloed zijn op je oudere code. Maar al met al is TypeScript 5.0 een belangrijke stap voorwaarts in de bruikbaarheid en flexibiliteit van het Microsoft-platform.
