Prošlog smo ljeta morali pretvoriti ogromnu bazu koda (18 000+ redaka koda) iz JavaScript-a u TypeScript. Naučio sam puno o snagama i slabostima svake od njih i kada ima smisla koristiti jedno preko drugog.
Ovaj je članak sada dostupan na japanskom i kineskom jeziku.
Kad ima smisla koristiti TypeScript
Kada imate veliku bazu kodova
Kada je vaša baza kodova velika i više od jedne osobe radi na projektu, sustav tipova može vam pomoći da izbjegnete puno uobičajenih pogrešaka. To se posebno odnosi na aplikacije na jednoj stranici.
Svaki put kad bi jedan programer mogao uvesti prijelomne promjene, općenito je dobro imati nekakav sigurnosni mehanizam.
Prepisivač TypeScript otkriva najočitije pogreške - iako neće čarobno eliminirati potrebu za otklanjanjem pogrešaka.
Ako vaša baza kodova nije toliko velika, vjerojatno nema smisla povećavati je dodavanjem oznaka tipa. Konvertirao sam 180+ datoteka iz JavaScript-a u TypeScript i u većini slučajeva dodao je oko 30% ukupnoj veličini koda.
Kada su programeri vašeg tima već navikli na statički upisane jezike
Ako vi ili većina tima potječete iz strogo otkucanih jezika poput C # ili Java i ne želite ući u JavaScript, TypeScript je dobra alternativa.
Iako preporučujem temeljito učenje Javascripta, ništa vas ne sprječava da koristite TypeScript bez poznavanja JavaScript-a. Zapravo je TypeScript stvorio isti tip koji je izradio C #, pa su sintakse slične.
U mojoj tvrtki imali smo tim programera za C # koji su kodirali sofisticiranu desktop aplikaciju u C # i WPF (što je u osnovi prednji alat za razvoj za stolni svijet). Zatim su zamoljeni da se pridruže web projektu kao programeri punog sloga. Tako su u kratkom redoslijedu uspjeli naučiti TypeScript za prednji kraj, a zatim iskoristiti svoje znanje C # za stražnji kraj.
TypeScript može poslužiti kao zamjena za Babel
Stari je Microsoft uzimao standardne alate - Java na primjer - i dodavao im zaštićene nestandardne značajke - u ovom slučaju rezultiralo je J ++. Tada bi pokušali natjerati programere da biraju između njih dvoje.
TypeScript je potpuno isti pristup - ovaj put za JavaScript. Inače, ovo nije prva Microsoftova vilica JavaScript-a. 1996. račvali su JavaScript za stvaranje JScript-a.
Iako je to rjeđi slučaj upotrebe, tehnički je moguće transpilirati ES6 kôd u ES5 pomoću TypeScript transpilera. To je moguće jer je ES6 u osnovi podskupina Typescripta, a TypeScript transpiler generira ES5 kôd.
Prepisivač Typescripta generira prilično čitljiv Javascript (EcmaScript 5) kôd kao izlaz. To je bio jedan od razloga zašto je tim Angular 2 odabrao TypeScript umjesto Googleovog Dart jezika.
Također, TypeScript ima neke sjajne značajke koje nisu u ES6, poput enuma i mogućnosti inicijalizacije varijabli člana u konstruktoru. Nisam veliki ljubitelj nasljeđivanja, ali smatram korisnim imati javne, privatne, zaštićene i apstraktne ključne riječi u nastavi. TypeScript ih ima, a ES6 nema.
Naši programeri za C # smatrali su da je nevjerojatno što smo mogli napisati lambda funkciju kao tijelo metode - koja je eliminirala glavobolje povezane s ovom ključnom riječi.
Kad biblioteka ili okvir preporučuju TypeScript
Ako koristite Angular 2 ili drugu biblioteku koja preporučuje TypeScript, krenite s tim. Pogledajte što ovi programeri imaju za reći nakon što su šest mjeseci koristili Angular 2.
Samo znajte da - iako TypeScript može koristiti sve JavaScript knjižnice iz okvira - ako želite dobre sintaksne pogreške, morat ćete izvana dodati definicije tipova za te knjižnice. Srećom, fini momci iz DefinitelyTyped izgradili su repo koji se temelji na zajednici s alatima za upravo to. Ali ovo je još jedan dodatni korak prilikom postavljanja projekta
(U napomeni: za sve vas JSX fanove pogledajte TSX.)
Kad zaista osjetite potrebu za brzinom
To bi vas moglo šokirati, ali TypeScript kôd u nekim situacijama može imati bolju izvedbu od JavaScript-a. Dopustite mi da objasnim.
U našem JavaScript kodu imali smo puno provjera tipova. Bila je to aplikacija MedTech, pa bi čak i mala pogreška mogla biti doslovno kobna ako se s njom ne postupi pravilno. Dakle, mnoge funkcije imale su izjave poput:
if(typeof name !== ‘string) throw ‘Name should be string’Pomoću Typescripta mogli bismo eliminirati puno tih provjera tipova zajedno.
To je posebno pokazalo svoj učinak u dijelovima koda gdje smo prethodno imali usko grlo u izvedbi, jer smo uspjeli preskočiti puno nepotrebnih provjera vrsta izvršavanja.
Pa kad vam je bolje bez Typescripta?
Kad si ne možete priuštiti dodatni porez za prevođenje
Ne planira se podržavati TypeScript izvorno u preglednicima. Chrome je izveo eksperiment, ali je kasnije otkazao podršku. Pretpostavljam da to ima neke veze s nepotrebnim režijskim troškovima.
Ako netko želi kotače za vježbanje, može ih instalirati. No, bicikli ne bi trebali imati stalne kotače za vježbanje. To znači da ćete uvijek morati transpilirati svoj TypeScript kôd prije nego što ga pokrenete u pregledniku.
Za standardni ES6 sasvim je druga priča. Kada ES6 podržava većina preglednika, trenutna translacija ES6 u ES5 postat će nepotrebna (ažuriranje: da, zaista!).
ES6 je najveća promjena u jeziku JavaScript i vjerujem da će se većina programera s tim tek složiti. No, malo hrabrih koji žele isprobati sljedeću verziju eksperimentalnih značajki JavaScripta ili značajki koje još nisu implementirane u svim preglednicima - ionako će morati transpilirati.
Bez transpilacije, samo modificirate datoteku i osvježite svoj preglednik. To je to. Nisu potrebna gledanja, preslikavanja na zahtjev ili izrada sustava .
Ako odaberete TypeScript, na kraju ćete napraviti dodatno knjigovodstvo za definicije tipova za vaše Javascript biblioteke i okvire (pomoću DefinitelyTyped ili pisanjem vlastitih napomena o tipovima). To je nešto što ne biste trebali raditi za čiste JavaScript projekte.
Kada želite izbjeći čudne slučajeve uklanjanja pogrešaka
Izvorne karte olakšavaju otklanjanje pogrešaka u Typescriptu, ali status quo nije savršen. Postoje stvarno dosadni i zbunjujući rubni slučajevi.
Također, postoje problemi s otklanjanjem pogrešaka u ključnoj riječi "this" i svojstvima koja su joj pridružena (savjet: "_this" u većini slučajeva radi). To je zato što Sourcemaps trenutno nemaju dobru podršku za varijable - iako će se to u budućnosti promijeniti.
Kada želite izbjeći potencijalne kazne za izvedbu
U našem smo projektu imali više od 9.000 linija dobrog starog ES5 JavaScript-a koji je isporučio čistu konjsku snagu 3D 3DGL platnu. Tako smo i zadržali.
Prepisivač TypeScript (baš kao i Babel) ima značajke koje zahtijevaju generiranje dodatnog koda (nasljeđivanje, nabrajanje, generički podaci, async / await, itd.). Bez obzira na to koliko je dobar vaš transpiler, on ne može nadmašiti optimizaciju dobrog programera. Stoga smo odlučili zadržati ga u običnom ES5 radi lakšeg uklanjanja pogrešaka i primjene (bez ikakve transpilacije).
To je rečeno, kazna za izvedbu vjerojatno je zanemariva u usporedbi s prednostima tipskog sustava i modernije sintakse za većinu projekata. Ali postoje slučajevi u kojima su bitne milisekunde, pa čak i mikrosekunde, pa se u tim slučajevima ne preporučuje transpilacija bilo koje vrste (čak ni s Babel, CoffeeScript, Dart, itd.).
Imajte na umu da Typescript ne dodaje dodatni kôd za provjeru vremena izvođenja. Sva provjera tipa događa se u vrijeme transpilacije, a bilješke o tipu uklanjaju se iz generiranog Javascript koda.
Kada želite maksimalizirati okretnost svog tima
Brže je postaviti nešto u JavaScript. Nedostatak tipskog sustava čini agilnost i lakoću mijenjanja stvari. Također olakšava razbijanje stvari, zato budite sigurni da znate što radite.
Javascript je fleksibilniji. Sjetite se da je jedan od glavnih slučajeva upotrebe sistemskog tipa otežavanje razbijanja stvari. Ako je Typescript Windows, Javascript je Linux.
U JavaScript Landu ne dobivate kotačiće za vježbanje tipskog sustava, a računalo pretpostavlja da znate što radite, ali vam omogućuje mnogo bržu vožnju i lakše manevriranje.
Ovo je posebno važno napomenuti ako ste još uvijek u fazi izrade prototipa. Ako je tako, ne gubite vrijeme s TypeScriptom. JavaScript je puno fleksibilniji.
Imajte na umu da je TypeScript superset JavaScripta. To znači da kasnije možete lako pretvoriti JavaScript u TypeScript.
Moja preferencija za JavaScript VS TypeScript
Sveukupno ne postoji jedan najbolji jezik. No, za svaki pojedinačni projekt postoji vjerojatno jedan objektivno najbolji jezik i knjižnica te okvir i baza podataka i operativni sustav i ... dobivate sliku.
Za naš projekt ima smisla koristiti TypeScript. Pokušao sam preoblikovati neke od svojih hobi projekata na TypeScript, ali nije vrijedilo truda.
Meni se osobno sviđa 5-ti o TypeScript-u:
- Potpuno je kompatibilan sa ES6. Zaista je lijepo vidjeti Microsoft kako se pošteno igra s ostalim preglednicima. Naš ekosustav može imati koristi od jakog suparnika Googleu, Mozilli i Appleu. Microsoft na to troši ozbiljnu energiju - poput pisanja Visual Studio koda ispočetka koristeći TypeScript na Google Chromeu svih platformi.
- Sustav tipova nije obavezan. Dolazeći iz pozadine C i Java, otkrio sam da nedostatak sustava tipova u JavaScript-u oslobađa. Ali mrzio sam gubiti vrijeme kad sam tijekom izvođenja naišao na glupe bube. TypeScript mi omogućuje da izbjegnem mnoge uobičajene bugove kako bih svoje vrijeme mogao usmjeriti na popravljanje pravih nezgodnih. Dobra je ravnoteža. Sviđa mi se. To je moj ukus. Koristim tipove kad god mogu jer mi to daje mir. Ali to sam ja. Ako koristim TypeScript, ne želim se ograničavati na njegove ES6 značajke.
- JavaScript kôd koji dolazi iz TypeScript transpilera vrlo je čitljiv. Nisam ljubitelj Sourcemapsa, pa većinu otklanjanja pogrešaka radim na generiranom JavaScriptu. To je apsolutno strašno. Potpuno mogu razumjeti zašto je Angular 2 odabrao TypeScript umjesto Dart-a.
- Razvojno iskustvo TypeScript-a je fantastično. VS Code vrlo je pametan kada se radi s JavaScriptom (neki mogu tvrditi da je to najpametniji JS IDE). Ali TypeScript pomiče ograničenja na sasvim novu razinu. Značajke automatskog dovršavanja i refaktoriranja u VSCodeu rade puno preciznije, a to nije zato što je IDE super pametan. To je sve zahvaljujući TypeScriptu.
- Bilješke o tipovima su poput dokumentacije osnovne razine. Oni izjavljuju vrstu podataka koji svaku funkciju očekuje, njihovi rezultati i razni drugi savjeti vole
readonly,publiciliprivateatributa. Prema mom iskustvu, pokušavajući rekonstruirati JavaScript kôd u TypeScript, obično završim s čistijim kodom ljepše strukture. Zapravo pisanje Typescripta poboljšalo je kako pišem obični JavaScript.
Strojopis nije odgovor za sve. U njega još uvijek možete upisati strašni kod.
Mrzitelji TypeScript-a mrzit će, bilo zbog straha od promjene ili zato što poznaju nekoga tko poznaje nekoga tko se toga boji. Život ide dalje, a TypeScript ionako uvodi nove značajke u svoju zajednicu.
Ali poput React-a, TypeScript je jedna od onih utjecajnih tehnologija koja pomiče granice našeg web razvoja.
Bez obzira koristite li TypeScript ili ne, ne škodi ga isprobati kako biste razvili vlastito mišljenje o njemu. Ima krivulju učenja, ali ako već znate JavaScript, bit će glatka.
Ovdje je mrežni TS transpiler u stvarnom vremenu s nekoliko primjera koji vam omogućuju usporedbu TypeScript koda s ekvivalentnim JavaScript kodom.
Evo kratkog vodiča i vrlo lijepog vodiča, ali ja sam više nekako momak koji govori o jeziku. Ako volite video, evo tečaja iz Udemyja.
John Papa ima kratki članak o ES5 i TypeScriptu.
Postoji zanimljiva studija koja pokazuje sve stvari jednake, tipski sustav smanjuje bugove za 15%.
Oh, i ako vam se ide na sporednu misiju, pročitajte zašto je programiranje najbolji posao ikad.