Hvorfor Du Bør Velge TypeScript Over JavaScript

BY admin
|

TypeScript har økt i sin popularitet de siste par årene. Det er nevnt blant de fem mest lovende språkene i 2020. Angular, en av de største frontend rammer, bruker TypeScript. Omtrent 60% av js programmerere bruker Allerede TypeScript, og 22% ønsker å prøve. Hvorfor?

Historisk Har JavaScript endt opp som hovedspråk for skripting av nettsider og apper på Internett. Det er nå mulig å bruke JavaScript på både frontend og backend med rammer som Node.js og Deno.

Men Ble JavaScript laget for å lage store, komplekse systemer som de på det moderne nettet? Niks.

i denne artikkelen vil vi introdusere deg til en løsning for Det-TypeScript-og komme i gang mot banen for å legge til typer I JavaScript-koden din.

Her er noen av punktene vi vil dekke:

  • Hva Er TypeScript?
  • hva er typer, og hvordan fungerer DE I TS?
  • JavaScript vs TypeScript: hvilken å velge?
  • hvordan komme I gang Med TypeScript.
  • Ytterligere ressurser for å studere TypeScript.

Hva Er TypeScript?

Kort sagt, TypeScript er et supersett Av JavaScript som har valgfri skriving og kompilerer til vanlig JavaScript.

I enklere ord Er TypeScript Teknisk JavaScript Med statisk skriving, når du vil ha det.

Nå, hva ville være årsakene til å legge til statisk skriving Til JavaScript?

jeg kan liste minst tre:

  • du kan unngå mesterlig skjult ninja feil som den klassiske 'undefined' is not a function.
  • det er lettere å refactor kode uten å bryte det betydelig.
  • Orientere seg i komplekse, store systemer er ikke et mareritt lenger.

faktisk viser en studie at 15% Av Alle JavaScript-feil kan oppdages Av TypeScript.

friheten til dynamisk skriving fører ofte til feil som ikke bare reduserer effektiviteten til programmørens arbeid, men kan også slipe utviklingen til å stoppe på grunn av økende kostnader ved å legge til nye kodelinjer.

derfor, svikt I JavaScript for å innlemme ting som typer og kompilere tid feilkontroller gjør det et dårlig valg for server-side kode i bedrifter og store kodebaser. Som deres slagord sier, Er TypeScript JavaScript Som skalerer.

Hva trenger jeg for å lære Å bruke TypeScript?

TypeScript er i hovedsak EN js linter. Eller, JS med dokumentasjon som kompilatoren kan forstå.

derfor, i motsetning til andre språk som CoffeeScript (som legger til syntaktisk sukker) eller PureScript (som ikke ser Ut Som JavaScript i det hele tatt), trenger du ikke å lære mye for å begynne å skrive TypeScript-kode.

Typer I TS er valgfrie, og hver js-fil er en gyldig TypeScript-fil. Mens kompilatoren vil klage hvis du har skrivefeil i de første filene, gir den deg tilbake En JavaScript-fil som fungerer som den gjorde før. Uansett hvor Du er, Vil TypeScript møte deg der, og det er lett å bygge opp dine ferdigheter gradvis.

Brukes TypeScript på frontend eller backend?

TypeScript er kompilert Til JavaScript. DERFOR KAN TS brukes hvor SOM HELST JS kan brukes: både frontend og backend.

JavaScript Er det mest populære språket for å implementere skripting for frontend av apper og nettsider. Dermed Kan TypeScript brukes til samme formål, men det skinner i komplekse bedriftsprosjekter på serversiden.

på Serokell, er det meste av vår web frontend implementert I TypeScript.

hva er typer, og hvordan fungerer DE I TS?

Kort introduksjon til typer

Typer er en måte å fortelle riktige programmer fra feil før vi kjører dem ved å beskrive i koden vår hvordan vi planlegger å bruke dataene våre. De kan variere fra enkle typer Som Tall og Streng til komplekse strukturer perfekt modellert for vårt problemdomene.

Programmeringsspråk faller inn i to kategorier: statisk skrevet eller dynamisk skrevet.

på språk med statisk skriving må typen av variabelen være kjent ved kompileringstid. Hvis vi erklærer en variabel, bør det være kjent (eller inferrable) av kompilatoren om det vil være et tall, en streng eller en boolsk. Tenk Java.

på språk med dynamisk skriving er dette ikke nødvendigvis slik. Typen av en variabel er kun kjent når du kjører programmet. Tenk Python.

TypeScript kan støtte statisk skriving, Mens JavaScript ikke gjør det.

på grunn av statisk skriving Av TypeScript, må du prøve hardere å:

  • innfør udefinerte variabler(hjelp for kompileringstidsvarsler)
  • summere to strenger som har tall i dem (som «4» + «20» = «420»)
  • gjør operasjoner på ting som ikke tillater dem, for eksempel å trimme et nummer.

med statiske typesystemer kan du lage dine egne kompositttyper. Dette gjør det mulig for ingeniører å uttrykke sine intensjoner mer detaljert.

Eksplisitte typer gjør også koden din selvdokumenterende: de sørger for at variablene og funksjonene samsvarer med det som er ment, og gjør det mulig for datamaskinen å ta vare på å huske den omkringliggende konteksten.

Typer Av TypeScript

TypeScript har en rekke grunnleggende typer, Som Boolsk, Tall, Streng, Array, Tuple, etc. Noen av disse finnes ikke I JS; du kan lære mer om Dem i dokumentasjonen Av TypeScript.

i tillegg til disse, er det noen andre typer vi vil ha for Å vise UTTRYKK for ts:

Alle & Ukjent

mens noen som en type kan dekke, vel, noe som du ønsker, ukjent er dens type-safe motstykke.

når du vil unnslippe typesystemet, lar any deg tilordne En JavaScript-variabel til den. Det brukes ofte til å modellere innkommende variabler (fra Tredjeparts Apier, for eksempel) som ennå ikke er sjekket og hvis type er ukjent.

Ukjent er mye som noe, men det vil ikke la deg utføre noen operasjoner på variabelen før den er eksplisitt typekontrollert.

Ugyldig

Void brukes når det ikke returneres noen verdi, for eksempel som returtype av funksjoner som ikke returnerer noe.

Aldri

Aldri er returtypen for noe som aldri skal skje, som en funksjon som vil kaste et unntak.

Kryss & Unionstyper

Disse gjør det mulig å opprette egendefinerte typer for å bedre passe din logikk.

Kryssingstyper gjør at du kan sette sammen flere grunnleggende typer i en type. Du kan for eksempel opprette en egendefinert type Person som har en name: string og en phone_number: number. Det tilsvarer å si: jeg vil at min type skal være dette og det.

Unionstyper gjør det mulig for din type å ta en av de flere grunnleggende typene. Du kan for eksempel ha en spørring som returnerer enten result: string eller undefined. Det tilsvarer å si: jeg vil at min type skal være dette eller det.

hvis du tenker på typer som mellomrom, gir alle disse typene raskt mening.

Typer I TypeScript kan være både implisitte og eksplisitte. Hvis du ikke skriver dine typer eksplisitt, vil kompilatoren bruke typen slutning å utlede typene du bruker.

Å Skrive dem eksplisitt, gir imidlertid fordeler som å hjelpe andre utviklere som leser koden din og sørge for at det du ser er hva kompilatoren ser.

TypeScript vs JavaScript

Det lønner seg å være pragmatisk. Ta en titt på denne grafen:

Fra ingensteds Er TypeScript nå i 7. plass I GitHub pull-forespørsler For Q1 2020, over PHP Og C. (Kilde)

mens en betydelig årsak til dette er støtte Fra TypeScript av selskaper Som Microsoft (som skapte Det) Og Google, støttes det av en god grunn.

3 grunner til å velge TypeScript over JavaScript

1. TypeScript er mer pålitelig

I motsetning Til JavaScript Er TypeScript-koden mer pålitelig og enklere å refactor. Dette gjør det mulig for utviklere å unngå feil og omskriver mye lettere.

Typer ugyldiggjør de fleste dumme feilene som kan snike seg inn I JavaScript-kodebaser, og lage en rask tilbakemeldingsløyfe for å fikse alle de små feilene når du skriver ny kode og refactoring.

2. TypeScript er mer eksplisitt

Making types explicit fokuserer vår oppmerksomhet på hvordan nøyaktig vårt system er bygget, og hvordan ulike deler av det samhandler med hverandre. I store systemer er det viktig å kunne abstrahere resten av systemet samtidig som konteksten holdes i tankene. Typer gjør oss i stand til å gjøre det.

3. TypeScript Og JavaScript er praktisk talt utskiftbare, så hvorfor ikke?

Siden JavaScript er et delsett Av TypeScript, kan du bruke Alle JavaScript-biblioteker og kode som du vil ha I TypeScript-koden.

Mest populære JavaScript – biblioteker har typer i 2020-Definitivt Skrevet er et lager med typer for mange Forskjellige JavaScript-biblioteker som du kan bruke til å gjøre samspillet med dem mer typesikkert.

Dette betyr at du gradvis kan vedta TypeScript i JavaScript-kodebasen, først legge til typer i individuelle moduler og deretter utvide til … forbruke det kjente universet, antar jeg.

Ulemper Med TypeScript

Du kan ikke bare ta Et JavaScript-team eller Et JavaScript-lager og umiddelbart bytte dem til idiomatisk TypeScript. Det er avveininger, og forhånd tid ofre du har å gjøre.

mens vi kan argumentere for besparelsene som er eksplisitte om typer, gir deg i det lange løp, på kort sikt, tar det mer tid å legge til dem. Dette er uten tvil ikke en stor avtale, men det er et argument til Fordel For JavaScript.

Derfor kan Du ikke velge TypeScript for små prosjekter og prototyper til eget bruk.

Tester vs Typer

to kort berøre diskusjonen om testing vs. typer: begge disse tingene fange ulike klasser av bugs, så det er fornuftig å gjøre både i en nonpartisan-aktig måte.

du kan fortsatt bruke både enhetstesting og mer avanserte teknikker som eiendomsbasert testing med TS, samtidig som du beholder fordelene ved et statisk typesystem.

for å oppsummere, her er en rask sammenligning av begge språk:

TypeScript JavaScript
TS er et objektorientert skriptspråk JS ER et objektorientert skriptspråk
Avhengig språk (kompilerer Til JavaScript) Uavhengig språk (kan tolkes og utføres)
Kompilert språk, kan ikke utføres direkte i en nettleser Tolket språk, utført direkte i en nettleser
kan skrives statisk dynamisk skrevet
Bedre strukturert og konsis mer fleksibel siden du ikke er begrenset av typesystemet
Har en .ts forlengelse Har en .js forlengelse
Opprettet På Microsoft Av Anders Hejlsberg (designer Av C#) og vedlikeholdt Av Microsoft Opprettet Av Brendan Eich (Netscape) og vedlikeholdt AV ECMA (European Computer Manufacturers Association).
et rettferdig valg for komplekse prosjekter Godt å jobbe med små, enkle prosjekter

TypeScript hurtigstartsveiledning

TypeScript compiler

for å kompilere TS-koden må du installere tsc (kort For TypeScript compiler). Den enkleste måten å gjøre det på er gjennom terminalen. Dette kan gjøres enkelt via npm ved å bruke følgende kommando:

npm install -g typescript

hvis Du vil bruke TypeScript Med Visual Studio-Kode, er det en praktisk guide på deres hjemmeside.

når du har installert tsc, kan du kompilere filene dine med tsc filename.ts.

Migrere filene dine Fra JavaScript Til TypeScript

La oss si at vi vil endre Følgende JavaScript-fil Til TypeScript på grunn av merkelig oppførsel:

function my_sum(a, b) { return a + b; }let a = 4; let b = "5";my_sum(a, b);

Gode nyheter. Enhver JS-fil er teknisk en gyldig TypeScript-fil, så du er en god start – bare bytt filtypen til .ts fra .js.

TypeScript har type inferens, noe som betyr at Den automatisk kan utlede noen av typene du bruker uten at du legger dem til. I dette tilfellet antar det at funksjonen summerer to variabler av typen noen, noe som er sant, men ikke til stor nytte akkurat nå.

hvis vi bare vil summere tall, kan vi legge til en typesignatur til my_sum for å få den til å godta bare tall.

function my_sum(a: number, b: number) { return a + b; }let a = 4; let b = "5";my_sum(a, b);

Nå Gir TypeScript oss en feil.

Argument of type 'string' is not assignable to parameter of type 'number'.

Bra vi fant hvor feilen er. 🙂 For ytterligere å unnslippe feil som disse, kan du også legge til typedefinisjoner til variabler.

let b: number = "5" // Type '"5"' is not assignable to type 'number'.let b: number = 5 // Everything ok.

TypeScript er ganske fleksibelt i hva Det kan gjøre og hvordan det kan hjelpe deg. For et mindre trivielt eksempel på hvordan du flytter din eksisterende JavaScript-kodebase Til TypeScript eller bruker TypeScript for å forbedre js-koden, les denne veiledningen.

hvordan bruke TypeScript i en nettleser?

For å kjøre TypeScript i en nettleser, må Den transpileres Til JavaScript med TypeScript compiler (tsc). I dette tilfellet oppretter tsc en ny .js fil basert på .ts kode, som du kan bruke noen måte du kan bruke En JavaScript-fil.

Ressurser for videre læring

TypeScript Dypdykk

Denne gratis webressursen har alt du trenger for å starte Med TypeScript, inkludert mer detaljerte forklaringer på seksjonene vi allerede har dekket her.

Lær TypeScript Fra Bunnen Av!

et praktisk 3-timers kurs som går gjennom alle De grunnleggende funksjonene Til TypeScript, hvordan du bruker Den til å samhandle med NOEN js-rammer, og hvordan du bruker Kraften til TypeScript mens du skriver JavaScript.

Øvelse

Exercism er den beste ressursen til å øve skrive kode i et nytt programmeringsspråk. Mentorer som vil styre deg mot idiomatisk kode, masse morsomme øvingsoppgaver-det er ingenting å ikke elske om denne nettsiden.

Konklusjoner

Samlet Sett Er TypeScript et flott verktøy å ha i verktøysettet ditt, selv om du ikke bruker det til full kapasitet. Det er lett å starte i det små og vokse sakte, lære og legge til nye funksjoner som du går. TypeScript er pragmatisk og innbydende for nybegynnere, så det er ikke nødvendig å være redd.

jeg håper denne artikkelen vil være nyttig i Din TypeScript-reise. Hvis du vil ha hjelp eller har noen spørsmål, må du spørre dem på våre sosiale medier som Twitter eller Facebook.