Programmering

Hva er TypeScript? Sterkt skrevet JavaScript

Hva er TypeScript? TypeScript definert

TypeScript er en variant av det populære programmeringsspråket JavaScript som legger til noen viktige funksjoner som er viktige for bedriftsutvikling. Spesielt er TypeScript sterkt skrevet - det vil si at variabler og andre datastrukturer kan erklæres for å være av en bestemt type, som en streng eller en boolsk, av programmereren, og TypeScript vil sjekke gyldigheten av deres verdier. Dette er ikke mulig i JavaScript løst skrevet.

TypeScript's sterke skriving muliggjør en rekke funksjoner som hjelper til med å gjøre utviklere mer effektive, spesielt når de arbeider med store kodebaser på bedriftsnivå. TypeScript er kompilert, snarere enn tolket som JavaScript, noe som betyr at feil kan fanges før utførelse; IDEer som utfører trinnvis kompilering i bakgrunnen, kan oppdage slike feil under kodingsprosessen.

Til tross for denne viktige forskjellen i JavaScript, kan TypeScript fortsatt kjøres hvor som helst JavaScript kan kjøres. Det er fordi TypeScript ikke kompilerer til en binær kjørbar, men med standard JavaScript. La oss dykke inn for å finne ut mer.

TypeScript vs. JavaScript 

TypeScript er en supersett av JavaScript. Mens riktig JavaScript-kode også er riktig TypeScript-kode, har TypeScript også språkfunksjoner som ikke er en del av JavaScript. Den mest fremtredende funksjonen som er unik for TypeScript - den som ga TypeScript navnet - er som nevnt sterk skriving: en TypeScript-variabel er assosiert med en type, som en streng, tall eller boolsk, som forteller kompilatoren hva slags data den kan inneholde. I tillegg støtter TypeScript typeinferanse, og inkluderer en hvilken som helst type, noe som betyr at variabler ikke trenger å få typene tildelt eksplisitt av programmereren; mer om det om et øyeblikk.

TypeScript er også designet for objektorientert programmering - JavaScript, ikke så mye. Konsepter som arv og tilgangskontroll som ikke er intuitive i JavaScript, er enkle å implementere i TypeScript. I tillegg lar TypeScript deg implementere grensesnitt, et stort sett meningsløst konsept i JavaScript-verdenen.

Når det er sagt, er det ingen funksjonalitet du kan kode i TypeScript som du ikke også kan kode i JavaScript. Det er fordi TypeScript ikke er kompilert i konvensjonell forstand - måten C ++ for eksempel er kompilert til en binær kjørbar fil som kan kjøres på spesifisert maskinvare. I stedet TypeScript-kompilatoren transkoder TypeScript-kode til funksjonelt ekvivalent JavaScript. Denne artikkelen fra Sean Maxwell på GitConnected har noen gode eksempler på objektorienterte TypeScript-kodebiter og deres JavaScript-ekvivalenter. Den resulterende JavaScript kan deretter kjøres hvor som helst JavaScript-kode kan kjøres, fra en nettleser til en server utstyrt med Node.js.

Så hvis TypeScript til slutt bare er en fancy måte å generere JavaScript-kode på, hvorfor bry seg med det? For å svare på det spørsmålet må vi se på hvor TypeScript kom fra og hva det brukes til.

Hva brukes TypeScript til?

TypeScript ble utgitt som åpen kildekode i 2012 etter å ha blitt utviklet i Microsoft. (Programvaregiganten er fortsatt prosjektets forvalter og hovedutvikler.) Denne ZDNet-artikkelen fra den tiden gir et spennende blikk på hvorfor det skjedde: “Det viser seg at en av de store motivasjonene var opplevelsen fra andre team hos Microsoft som forsøkte å utvikle seg. og vedlikeholde Microsoft-produkter i JavaScript. ”

På den tiden prøvde Microsoft å skalere Bing Maps som en konkurrent til Google Maps, samt å tilby nettversjoner av Office-pakken — og JavaScript var det viktigste utviklingsspråket for oppgavene. Men utviklerne fant det i det vesentlige vanskelig å skrive apper på skalaen til Microsofts flaggskiptilbud ved hjelp av JavaScript. Så de utviklet TypeScript for å gjøre det lettere å bygge applikasjoner på bedriftsnivå for å kjøre i JavaScript-miljøer. Dette er ånden bak tagline for språket på det offisielle TypeScript-prosjektnettstedet: "JavaScript som skalerer."

Hvorfor er TypeScript bedre for denne typen arbeid enn vanilje JavaScript? Vel, vi kan krangle for alltid om fordelene ved objektorientert programmering, men virkeligheten er at mange programvareutviklere som jobber med store bedriftsprosjekter er vant til det, og det hjelper med gjenbruk av kode som prosjekter ballong i størrelse. Du bør heller ikke overse i hvilken grad verktøy kan øke utviklerens produktivitet. Som nevnt støtter de fleste forretnings-IDEer trinnvis kompilering av bakgrunn, noe som kan oppdage feil mens du jobber. (Så lenge koden din er syntaktisk korrekt, vil den fremdeles transpileres, men det resulterende JavaScript fungerer kanskje ikke som det skal; tenk på feilkontrollen som tilsvarer stavekontroll.) Disse IDEene kan også hjelpe deg med å omforme koden når du kommer dypt inn i prosjekt.

Kort sagt brukes TypeScript når du vil ha bedriftsfunksjonene og verktøyene til et språk som Java, men du trenger koden din for å kjøre i et JavaScript-miljø. I teorien kan du skrive standard JavaScript som TypeScript-kompilatoren genererer selv, men det vil ta deg mye lenger tid, og kodebasen vil være vanskeligere for et stort team å forstå og feilsøke samlet.

Oh, og TypeScript har et annet pent triks i ermet: Du kan stille kompilatoren til å målrette mot et bestemt JavaScript-kjøretidsmiljø, nettleser eller til og med språkversjon. Siden hvilken som helst velformet JavaScript-kode også er TypeScript-kode, kan du for eksempel ta kode skrevet til ECMAScript 2015-spesifikasjonen, som inkluderte en rekke nye syntaktiske funksjoner, og kompilere den til JavaScript-kode som ville være i samsvar med eldre versjoner av språket.

Installer TypeScript

Klar til å begynne å spille med TypeScript? Det er enkelt å installere språket. Hvis du allerede bruker Node.js på utviklingsmaskinen din, kan du bruke NPM, Node.js pakkebehandling, til å installere den. Den offisielle TypeScript på 5 minutter opplæringen vil lede deg gjennom prosessen.

TypeScript kan også installeres som en plugin-modul til din valgte IDE, noe som gir deg verktøyfordelene vi snakket om ovenfor, og som også tar seg av prosessen med å kompilere TypeScript til JavaScript. Siden TypeScript ble utviklet av Microsoft, er det ikke overraskende at det er plugins av høy kvalitet tilgjengelig for Visual Studio og Visual Studio Code. Men som et åpen kildekodeprosjekt har TypeScript blitt tilpasset overalt, alt fra åpen kildekode-IDE som Eclipse til ærverdige tekstredigerere som Vim. Og hele prosjektet kan blades og lastes ned fra GitHub.

TypeScript-syntaks

Når TypeScript er installert, er du klar til å begynne å utforske, og det betyr å forstå det grunnleggende om TypeScript-syntaksen. Siden JavaScript er grunnlaget for TypeScript, må du være kjent med JavaScript før du begynner. Utvilsomt vil dine viktigste interessepunkter være de TypeScript-spesifikke funksjonene som gjør språket unikt; vi vil berøre høydepunktene her.

TypeScript-typer

Åpenbart er den viktigste syntaktiske funksjonen i TypeScript typesystemet. Språket støtter en rekke grunnleggende typer:

  • Boolsk: En enkel sann / falsk verdi.
  • Nummer: I TypeScript, som i JavaScript, er alle tall flytende punktverdier - det er ikke noe eget heltall. TypeScript støtter desimal-, heksadesimal-, binær- og oktalbokstav.
  • Streng: En streng med tekstdata. Du kan bruke enkle eller doble anførselstegn for å omgir strengen når du setter inn dataene. Du kan også bruke backticks ( ` ) for å omslutte strenger med flere linjer, og du kan legge inn uttrykk i en streng med syntaksen $ {expr}.
  • Arrays and tuples: Disse typene lar deg lagre flere verdier i en spesifisert sekvens. I en matrise er de enkelte verdiene av samme datatype, mens de i en tuple kan være heterogene. TypeScript for hver() metoden brukes til å kalle en funksjon på hvert element i en matrise.
  • Enum: Som typen med samme navn i C #, lar en TypeScript enum deg tildele menneskelig lesbare navn til en sekvens av numeriske verdier.
  • Eventuelt: Dette er en type for en variabel der du ikke nødvendigvis vet hvilken verdi den vil ende opp med på forhånd - den kan ta verdiene fra brukerinngang eller et tredjepartsbibliotek, for eksempel.
  • Objekt: Dette er typen som representerer alt som ikke er en primitiv type; det er viktig for den objektorienterte naturen til TypeScript.

Det er to forskjellige måter å eksplisitt tildele en type til en variabel. Den første er syntaksen for vinkelfeste:

let someValue: any;

la strLength: number = (someValue) .length;

Og det andre er som syntaks:

let someValue: any = "dette er en streng";

let strLength: number = (someValue as string) .length;

Disse kodebitene, som er hentet fra TypeScript-dokumentasjonen, er funksjonelt likeverdige. Begge definerer someValue som en variabel av typen noen og tilordne "dette er en streng" som verdi, definer deretter strLength som et tall og tildeler som verdien lengden på innholdet på someValue.

TypeScript-typer kan også angis ved slutning. Det vil si at hvis du setter en verdi på x til 7 uten å fastslå hvilken type x er, vil kompilatoren anta at x skal være et tall. Under noen omstendigheter kan kompilatoren utlede en noen type, selv om du kan bruke kompilasjonsflagg for å sikre at det ikke gjør det.

TypeScript-typesystemet er ganske rikt og går utover omfanget av denne artikkelen. Det finnes en rekke avanserte typer og verktøy; disse inkluderer unionstyper, som lar deg fastslå at en variabel vil være en av flere spesifiserte typer, og kartlagte typer, som er typer du kan lage basert på en eksisterende type, der du forvandler hver eiendom i den eksisterende typen i samme vei. For eksempel kan du opprette en unionstype for en variabel som du vil være enten et tall eller en boolsk, men ikke en streng eller noe annet; eller du kan opprette en kartlagt type som angir at alle elementene i en matrise skal være skrivebeskyttet.

TypeScript-grensesnitt

Som de fleste objektorienterte språk har TypeScript grensesnitt, som lar brukerne definere sine egne typer. Grensesnitt etablerer egenskapene som et objekt har, sammen med typene som er knyttet til disse egenskapene. TypeScript-grensesnitt kan ha valgfrie egenskaper. For mer informasjon om syntaksen, sjekk TypeScript-dokumentasjonen.

TypeScript generiske

TypeScript deler også konseptet med generiske legemidler med objektorienterte språk som Java og C #. (Tilsvarende anlegg i C ++ kalles a mal.) I TypeScript kan generiske komponenter fungere over en rekke typer, i stedet for bare en, avhengig av hvor i koden disse komponentene heter. Her er et veldig enkelt eksempel fra TypeScript-dokumentasjonen. Først vurderer du denne funksjonen, som tar inn et argument og deretter returnerer den umiddelbart:

funksjonsidentitet (arg: any): hvilken som helst {

retur arg;

}

Fordi funksjonen er definert med noen type, vil den akseptere et argument av hvilken type du velger å kaste på det. Imidlertid, hva det returnerer vil være av noen type. Her er en versjon av funksjonen som bruker generikk:

funksjonsidentitet (arg: T): T {

retur arg;

}

Denne koden inkluderer type variabel T, som fanger typen innkommende argument og lagrer den til senere bruk.

Det er mye mer med generiske stoffer, som er nøkkelen til å gjøre kode gjenbruk mulig i store foretaksprosjekter. Sjekk TypeScript-dokumentasjonen for detaljer.

TypeScript-klasse 

I objektorientert programmering, klasser arve funksjonalitet, og i sin tur tjene som byggesteiner for gjenstander. JavaScript brukte tradisjonelt ikke klasser, i stedet for å stole på funksjoner og prototypebasert arv, men konseptet ble lagt til språket som en del av ECMAScript 2015-versjonen av standarden. Klasser hadde allerede vært en del av TypeScript, og nå bruker TypeScript samme syntaks som JavaScript. En av fordelene med TypeScript-kompilatoren er at den kan forvandle kode med JavaScript-klasser til eldre JavaScript-kode som samsvarer med standardene før 2015.

TypeScript-dato

Det er en rekke metoder og objekter tilgjengelig for å hente og sette dato og tid i TypeScript, hovedsakelig arvet fra JavaScript. JavaTPoint har en god oversikt over hvordan dette fungerer.

TypeScript opplæring 

Klar til å gå dypere? Bli oppdatert med disse TypeScript-opplæringene:

  • TypeScript på 5 minutter vil lede deg gjennom prosessen med å installere TypeScript hvis du ikke allerede har gjort det.
  • Denne Visual Studio Code-opplæringen demonstrerer hvordan IDE-er virkelig legger til TypeScript-utviklingsproduktiviteten.
  • TypeScript Tutorial for nybegynnere: The Missing Guide er en veldig grundig introduksjon som vil være nyttig selv om du har ganske begrenset JavaScript-opplevelse.

Hvis du ønsker å lære hvordan du bruker TypeScript med React, JavaScript-biblioteket for å bygge brukergrensesnitt utviklet av Facebook, kan du sjekke hvordan du bruker TypeScript med React og Redux fra Ross Bulat og delen om React og webpack i TypeScript-dokumentasjonen. Glad læring! 

$config[zx-auto] not found$config[zx-overlay] not found