Što je TypeScript? Snažno otkucan JavaScript

Što je TypeScript? Definiran TypeScript

TypeScript je varijacija popularnog programskog jezika JavaScript koja dodaje neke ključne značajke važne za razvoj poduzeća. Konkretno, TypeScript je snažno upisan - tj. Programeri mogu proglasiti varijable i druge podatkovne strukture određenim tipom, poput niza ili logičke vrijednosti, a TypeScript će provjeriti valjanost njihovih vrijednosti. To nije moguće u JavaScript-u koji je slabo otkucan .

Snažno tipkanje TypeScript-a omogućuje niz značajki koje pomažu razvojnim programerima učiniti učinkovitijima, posebno kada se radi o velikim kodnim bazama velikih razmjera. TypeScript se kompajlira, a ne interpretira kao JavaScript, što znači da se pogreške mogu uhvatiti prije izvršenja; IDE-ovi koji izvode pozadinsku inkrementalnu kompilaciju mogu uočiti takve pogreške tijekom postupka kodiranja.

Unatoč ovoj ključnoj razlici u odnosu na JavaScript, TypeScript se i dalje može izvršiti bilo gdje gdje se JavaScript može pokretati. To je zato što TypeScript ne kompajlira u binarnu izvršnu datoteku, već u standardni JavaScript. Zaronimo i saznajmo više.

TypeScript u odnosu na JavaScript 

TypeScript je superset JavaScripta. Iako je bilo koji ispravan JavaScript kôd također ispravan TypeScript kôd, TypeScript također ima jezične značajke koje nisu dio JavaScript-a. Najistaknutija značajka jedinstvena za TypeScript - ona koja je Typescripu dala ime - je, kao što je napomenuto, jako tipkanje: TypeScript varijabla pridružena je tipu, poput niza, broja ili logičke vrijednosti, koji prevoditelju govori o vrsti podataka može držati. Uz to, TypeScript podržava zaključivanje tipa i uključuje sve vrste hvatanja, što znači da programer ne mora svoje tipove eksplicitno dodijeliti; o tome više za trenutak. 

TypeScript je također dizajniran za objektno orijentirano programiranje - JavaScript, ne toliko. Koncepti poput nasljeđivanja i kontrole pristupa koji nisu intuitivni u JavaScript-u jednostavni su za implementaciju u TypeScript-u. Uz to, TypeScript vam omogućuje implementaciju sučelja, uglavnom besmislenog koncepta u svijetu JavaScript-a.

Međutim, ne postoji funkcionalnost koju možete kodirati u TypeScript-u, a ne možete kodirati i u JavaScript-u. To je zato što TypeScript nije kompiliran u uobičajenom smislu - način na primjer, C ++ se kompajlira u binarnu izvršnu datoteku koja se može izvoditi na navedenom hardveru. Umjesto toga, prevodilac TypeScript transkodira TypeScript kôd u funkcionalno ekvivalentni JavaScript. Ovaj članak Seana Maxwella na GitConnectedu sadrži nekoliko izvrsnih primjera objektno orijentiranih isječaka TypeScript koda i njihovih JavaScript ekvivalenata. Rezultirajući JavaScript tada se može pokrenuti bilo gdje bilo koji JavaScript kôd, od web preglednika do poslužitelja opremljenog Node.js.

Pa ako je TypeScript na kraju samo otmjen način generiranja JavaScript koda, zašto se zamarati time? Da bismo odgovorili na to pitanje, moramo pogledati odakle potiče TypeScript i za što se koristi.

Za što se koristi TypeScript?

TypeScript je objavljen kao otvoreni izvor 2012. godine nakon što je razvijen u Microsoftu. (Softverski div ostaje upravitelj i glavni programer projekta.) Ovaj članak iz ZDNeta iz tog vremena nudi intrigantan pogled na to zašto se to dogodilo: „Ispada da je jedna od velikih motivacija bilo iskustvo drugih timova u Microsoftu koji su pokušavali razviti i održavati Microsoftove proizvode u JavaScript-u. "

U to je vrijeme Microsoft pokušavao proširiti Bing Maps kao konkurenta Google Mapsu, kao i ponuditi web verzije svog Office paketa - a JavaScript je bio primarni razvojni jezik za zadatke. No, programerima je u osnovi bilo teško pisati aplikacije na razini Microsoftovih vodećih ponuda koristeći JavaScript. Stoga su razvili TypeScript kako bi olakšali izgradnju aplikacija na razini poduzeća za pokretanje u JavaScript okruženjima. To je duh iza slogana za jezik na službenoj web lokaciji projekta TypeScript: "JavaScript koji se skalira."

Zašto je TypeScript bolji za ovu vrstu posla od vanilin JavaScript-a? Pa, možemo zauvijek raspravljati o zaslugama objektno orijentiranog programiranja, ali stvarnost je takva da su mnogi programeri softvera koji rade na velikim poslovnim projektima navikli na to, a pomaže kod ponovne upotrebe koda kao balona veličine. Također ne biste trebali zanemariti u kojoj mjeri alati mogu povećati produktivnost programera. Kao što je napomenuto, većina IDE-a za tvrtku podržava pozadinsku inkrementalnu kompilaciju koja može uočiti pogreške tijekom rada. (Sve dok je vaš kôd sintaksički ispravan, on će se i dalje transpilirati, ali rezultirajući JavaScript možda neće raditi ispravno; smatrajte provjeru pogreške ekvivalentom provjere pravopisa.) Ovi IDE-ovi također vam mogu pomoći u refaktoru koda dok ulazite duboko u svoj projekt.

Ukratko, TypeScript se koristi kada želite korporativne značajke i alate jezika poput Jave, ali trebate svoj kôd za izvršavanje u JavaScript okruženju. U teoriji biste mogli napisati standardni JavaScript koji TypeScript kompajler sam generira, ali trebalo bi vam puno više vremena i velikom bi timu bilo teže zajedničko razumijevanje i uklanjanje pogrešaka kodne baze.

Oh, i TypeScript ima još jedan zgodan trik: možete postaviti kompajler da cilja određeno JavaScript runtime okruženje, preglednik ili čak jezičnu verziju. Budući da je bilo koji dobro oblikovani JavaScript kôd ujedno i TypeScript kôd, možete, na primjer, uzeti kod napisan u specifikaciji ECMAScript 2015, koji je sadržavao brojne nove sintaksičke značajke, i kompilirati ga u JavaScript kôd koji bi bio u skladu s naslijeđenim verzijama Jezik.

Instalirajte TypeScript

Spremni za početak igranja s TypeScriptom? Instalacija jezika je jednostavna. Ako na svom razvojnom stroju već koristite Node.js, za njegovo instaliranje možete koristiti NPM, upravitelj paketa Node.js. Službeni TypeScript za 5 minuta vodit će vas kroz postupak.

TypeScript se također može instalirati kao dodatak vašem odabranom IDE-u, što će vam pružiti prednosti alata o kojima smo govorili gore, a također će se pobrinuti za proces kompajliranja TypeScript-a u JavaScript. Budući da je TypeScript razvio Microsoft, nije iznenađujuće što postoje visokokvalitetni dodaci dostupni za Visual Studio i Visual Studio Code. Ali kao projekt otvorenog koda, TypeScript je prilagođen posvuda, počevši od IDE-a otvorenog koda poput Eclipsea do časnih uređivača teksta poput Vima. I cijeli projekt se može pregledavati i preuzimati s GitHub-a.

Sintaksa TypeScript

Jednom kada je TypeScript instaliran, spremni ste za početak istraživanja, a to znači razumijevanje osnova sintakse TypeScript. Budući da je JavaScript temelj Typescripta, morate biti upoznati s JavaScriptom prije nego što započnete. Nema sumnje da će vaše glavne točke interesa biti značajke specifične za TypeScript koje jezik čine jedinstvenim; ovdje ćemo se dotaknuti visokih točaka.

TypeScript tipovi

Očito je najvažnija sintaktička značajka u TypeScriptu sustav tipova. Jezik podržava brojne osnovne vrste:

  • Boolean: Jednostavna vrijednost true / false.
  • Broj: U TypeScript-u, kao i u JavaScript-u, svi brojevi imaju vrijednosti s pomičnim zarezom - ne postoji zaseban cijeli broj. TypeScript podržava decimalne, heksadecimalne, binarne i osmičke literale.
  • Niz: niz tekstualnih podataka. Pri postavljanju podataka možete upotrijebiti jednostruke ili dvostruke navodnike da biste okružili niz. Također možete koristiti povratne znakove ( `) za okruživanje nizova s ​​više redaka, a izraze možete umetnuti u niz sa sintaksom ${ expr }.
  • Nizovi i korice: Ovi tipovi omogućuju pohranu više vrijednosti u navedenom slijedu. U nizu su pojedinačne vrijednosti istog tipa podataka, dok u skupu mogu biti heterogene. Metoda TypeScript forEach()koristi se za pozivanje funkcije na svakom elementu u nizu.
  • Enum: Poput istoimenog tipa u C #, TypeScript enum omogućuje vam da dodijelite čovjeku čitljiva imena nizu numeričkih vrijednosti.
  • Bilo koji: Ovo je vrsta za varijablu kod koje ne morate unaprijed znati s kojom će vrijednosti završiti - svoje vrijednosti može uzeti na primjer iz korisničkog unosa ili iz biblioteke treće strane.
  • Objekt: Ovo je tip koji predstavlja sve što nije primitivan tip; bitno je za objektno orijentiranu prirodu Typescripta.

Postoje dva različita načina za eksplicitno dodjeljivanje tipa varijabli. Prva je sintaksa kutnih zagrada:

neka neka vrijednost: bilo koja;

neka strLength: number = (someValue) .length;

A druga je assintaksa:

neka someValue: bilo = "ovo je niz";

neka strLength: number = (someValue kao niz) .length;

Ovi isječci koda koji su preuzeti iz TypeScript dokumentacije funkcionalno su ekvivalentni. Obje definiraju someValuekao varijablu tipa anyi dodjeljuju "this is a string"kao njezinu vrijednost, a zatim definiraju strLengthkao broj i kao vrijednost dodjeljuju duljinu sadržaja someValue.

Tipovi TypeScript mogu se postaviti i zaključivanjem. Odnosno, ako postavite vrijednost x na 7 bez utvrđivanja tipa x, sastavljač će pretpostaviti da bi x trebao biti broj. U nekim okolnostima prevoditelj može zaključiti o anytipu, iako možete upotrijebiti zastavice kompilacije kako biste bili sigurni da to nije slučaj.

Sustav tipova TypeScript prilično je bogat i nadilazi opseg ovog članka. Postoji niz naprednih i korisnih vrsta; to uključuje tipove unija koji vam omogućuju da utvrdite da će varijabla biti jedan od nekoliko navedenih tipova i mapirane tipove, a to su tipovi koje možete stvoriti na temelju postojećeg tipa, u kojem svako svojstvo u postojećem tipu transformirate u isti put. Na primjer, mogli biste stvoriti tip unije za varijablu koja želi biti broj ili logička vrijednost, ali ne niz ili bilo što drugo; ili biste mogli stvoriti mapirani tip koji postavlja sve elemente u polju samo za čitanje.

Sučelje TypeScript

Kao i većina objektno orijentiranih jezika, TypeScript ima sučelja koja omogućuju korisnicima da definiraju vlastite tipove. Sučelja uspostavljaju svojstva koja objekt ima, zajedno s vrstama povezanim s tim svojstvima. TypeScript sučelja mogu imati neobavezna svojstva. Dodatne informacije o sintaksi potražite u dokumentaciji TypeScript.  

Generički TypeScript

TypeScript također dijeli koncept generičkih podataka s objektno orijentiranim jezicima kao što su Java i C #. (Ekvivalentna mogućnost u C ++-u naziva se predložak.) U TypeScript-u generičke komponente mogu raditi na različitim vrstama, a ne samo na jednoj, ovisno o tome gdje se u kodu te komponente pozivaju. Evo vrlo jednostavnog primjera iz TypeScript dokumentacije. Prvo razmotrite ovu funkciju koja uzima argument, a zatim ga odmah vraća:

identitet funkcije (arg: bilo koji): bilo koji {

    povrat arg;

}

Budući da je funkcija definirana s anytipom, prihvatit će argument bilo koje vrste koju odlučite na nju baciti. Međutim, ono što vrati bit će tog anytipa. Evo verzije funkcije koja koristi generičke lijekove:

identitet funkcije (arg: T): T {

    povrat arg;

}

Ovaj kod uključuje varijablu tipaT koja bilježi vrstu dolaznog argumenta i pohranjuje ga za našu kasniju upotrebu.

Mnogo je više generičkih lijekova, koji su ključni za omogućavanje ponovne upotrebe koda u velikim poslovnim projektima. Pojedinosti potražite u dokumentaciji TypeScript.

Klasa TypeScript 

U objektno orijentiranom programiranju klase nasljeđuju funkcionalnost i zauzvrat služe kao građevni blokovi objekata. JavaScript se tradicionalno nije služio klasama, već se oslanjao na funkcije i nasljeđivanje temeljeno na prototipu, ali koncept je dodan jeziku kao dio verzije standarda ECMAScript 2015. Predavanja su već bila dio Typescripta, a sada TypeScript koristi istu sintaksu kao JavaScript. Jedna od prednosti TypeScript-ovog kompajlera je što može transformirati kod s JavaScript klasama u naslijeđeni JavaScript kôd koji je u skladu sa standardima prije 2015. godine.

Datum TypeScript-a

Dostupne su brojne metode i objekti za dobivanje i postavljanje datuma i vremena u TypeScript-u, uglavnom naslijeđeni iz JavaScript-a. JavaTPoint dobro opisuje kako ovo funkcionira.

Vodič za TypeScript 

Spremni za dublje? Ubrzajte s ovim tutorijalima za TypeScript:

  • TypeScript za 5 minuta provest će vas kroz postupak instaliranja TypeScript-a ako to već niste učinili.
  • Ovaj vodič za Visual Studio Code pokazuje kako IDE-ovi stvarno dodaju vašu produktivnost u razvoju TypeScript-a.
  • Vodič za TypeScript za početnike: Vodič koji nedostaje zaista je temeljit uvod koji će biti koristan čak i ako imate prilično ograničeno JavaScript iskustvo.

Ako želite naučiti kako koristiti TypeScript s Reactom, JavaScript biblioteku za izgradnju korisničkih sučelja koju je razvio Facebook, pogledajte kako koristiti TypeScript s Reactom i Reduxom od Rossa Bulata i odjeljak React i webpack u TypeScript dokumentaciji. Sretno učenje!