Sådan overfører du dit JavaScript-program til TypeScript

JavaScript blev oprindeligt udgivet i 1995 efter en svimlende kort udviklingsperiode, og siden er JavaScript blevet en integreret del af mange websteder og apps. I dag har JavaScript fundet et hjem i både klient- og server-side applikationer. Udviklere efterspørger stadig masser af funktioner, på trods af alle de ændringer, de har oplevet gennem årene.

TypeScript er et scriptsprog, der udvider JavaScript med mange af disse længe ventede funktioner. Typeannotering, brugerdefineret indtastning og grænseflader er alle hovedkomponenter sammen med bedre værktøj til at øge produktiviteten.

Hvorfor gider du skifte?

Udsigten til at skifte sprog ud på større projekter kan være stressende. Heldigvis for alle, der overvejer opgaven, er processen med at portere et projekt fra JavaScript til TypeScript ret enkel.

JavaScript har brugt de sidste par år på at vinde indpas som et stort programmeringssprog. Oprindeligt kun brugt til front-end scripting på websteder, udgivelsen af ​​Node.js bragte JavaScript-serversiden, og hjalp med at udvide dens popularitet.

Selvom JavaScript er blevet langt mere populært for nylig, er der masser af funktioner, som dens seneste implementering, ES6, stadig mangler. For mange udviklere begrænser disse manglende funktioner anvendeligheden af ​​JavaScript som sprog.

TypeScript sigter mod at rette op på disse bekymringer ved at indpakke JavaScript med ekstra funktioner og derefter transpilere brugerkode. Resultatet er et typesikkert sprog med JavaScripts lethed og brugervenlighed.

Der er allerede flere værktøjer og rammer derude med fuld TypeScript-understøttelse. Angular har brugt det i lang tid, og endda React har måder at implementere TypeScript på.

TypeScript er ligesom JavaScript-forbedret

TypeScript implementerer mange af de funktioner, som udviklere ofte efterspørger i JavaScript. TypeScript er opkaldt efter det komplette typesystem, som det implementerer, inklusive funktioner som typekontrol, sikkerhed og implicit indtastning. TypeScript lader dig endda definere og bruge brugerdefinerede navnerum.

TypeScript indeholder også grænseflader, opregninger og typeslutning. TypeScript opretholder understøttelse af funktioner fra den seneste JavaScript-implementering sammen med ældre funktioner og tilføjer en række nye funktioner.

Overordnet set er TypeScripts fokus på at skabe en mere sikker udviklingsproces med stærkere værktøj til at hjælpe kodere.

Det tilskynder til typesikker kode

TypeScript bruger et indbygget typekontrolsystem til at validere variabeltyper. Det inkluderer et sæt standardtyper med mulighed for at definere dine egne klasser og typer. Typer kan udtrykkeligt erklæres eller udledes baseret på tildeling.

TypeScript har flere standarddatatyper, herunder strenge, tal, booleaner og tupler. Der er også de variable typer, som ukendt og enhver, som lader dig bruge svagt indtastet kode.

TypeScripts typeinferens giver dig mulighed for at køre typetjek på selv standard JavaScript-kode ved at køre den gennem TypeScripts transpiler.

Transpilering gør det nemt at bruge

Fra et udviklerperspektiv er en af ​​de bedste funktioner ved TypeScript, at den udsender vanilje JavaScript. Du kan køre TypeScript-kode gennem en proces kendt som transpilation, som ligner kompilering.

I stedet for en eksekverbar er resultatet af transpilering et script på et andet sprog end kodens originale.

TypeScript-kode overføres til JavaScript, som du derefter kan køre på en server eller klient. Dette lader dig hurtigt og nemt skrive kode, som du kan køre på næsten enhver platform.

TypeScript hjælper udviklerproduktivitet

Tilføjelse af typer til JavaScript gør det ikke kun muligt for kode at køre sikkert, det giver også udviklere værktøjer, der gør kodning nemmere. De fleste moderne IDE'er tilbyder TypeScript-understøttelse, der tillader kodefuldførelsesværktøjer som IntelliSense at tilbyde ekstra kontekst til kode. Det kan også tilbyde typekontrol, mens du skriver, hvilket hjælper dig med at fange fejl hurtigere.

Derudover er TypeScripts ekstra datastrukturer og syntaks designet til at øge kodelæsbarheden. Disse funktioner gør det hurtigere og nemmere at skabe kode af høj kvalitet og spotte potentielle problemer, før de bliver problematiske.

Hvordan kan du portere din kode?

Hvis du starter et helt nyt projekt, oprettelse af et nyt TypeScript-projekt er ret simpelt. Konvertering af et allerede eksisterende projekt til TypeScript er dog lidt mere involveret.

Under de fleste normale omstændigheder er udsigten til at konvertere et projekt fra et sprog til et andet skræmmende. Konverteringen fra JavaScript til TypeScript er dog overraskende enkel.

TypeScript som et supersæt af JavaScript

TypeScript betragtes som et supersæt af JavaScript. Det betyder, at TypeScript tilføjer yderligere lag af syntaks og funktionalitet uden at ændre eller fjerne den kernefunktionalitet, som den bygger op omkring.

For udviklere betyder det, at enhver kode, der kører korrekt i JavaScript, automatisk kører korrekt i TypeScript. Uanset om det pågældende script er en webserver skrevet til at køre i NodeJS, eller et sæt frontend-scripts til en webside, er det usædvanligt simpelt at skifte.

Efter installation af TypeScript-transpileren kan du oprette en enkel tsconfig.json fil med følgende indhold:

{
"compilerOptions": {
"outDir": "./build",
"allowJs": rigtigt,
"mål": "es5"
 },
"omfatte": ["./src/**/*"]
}

Flyt alle relevante filer til src-mappen og kør transpileren. Dette vil oprette de resulterende JavaScript-filer i bygge vejviser.

Disse hurtige og enkle ændringer vil konvertere et standard JavaScript-projekt til et TypeScript-projekt. Herfra er du fri til at bruge de nye funktioner, som TypeScript tilbyder, når du har lyst. Du kan kommentere typer på variabler, implementere brugerdefinerede typer og definere grænseflader.

Efter hver transpilering kan du bruge outputtet fra bygge mappe efter behov ved at tilføje filerne til ethvert projekt, ligesom du normalt ville. Transpileren skriver check standard JavaScript og konverterer nye funktioner til gyldige ES5 scripts.

Hvad du behøver at vide for at gå fra JS til TS

Processen med at konvertere et projekt fra JavaScript til TypeScript er usædvanligt let. Konvertering er så simpelt som at skifte mappestrukturen ud, tilføje en konfigurationsfil og installere transpileren.

At få alle fordelene ud af det nye sprog kan dog være et meget længere projekt. Mens TypeScript kan udlede typen af ​​hver variabel i et projekt, bør disse udtrykkeligt erklæres. Det kan være tidskrævende at gå tilbage og tilføje brugerdefinerede typer til et projekt, tilføje korrekte annoteringer og oprette grænseflader.

Tilføjelse af disse funktioner til et projekt vil dog give dig mulighed for at høste de fordele, der følger med korrekt typekontrol og udvidet værktøj. Større projekter vil være hurtigere og nemmere at bygge, du vil identificere fejl tidligere, og nye udviklere vil have lettere ved at læse din kode.