de ce ar trebui să alegeți Typescript peste JavaScript

TypeScript a crescut în popularitate în ultimii ani. Este menționat printre cele mai promițătoare cinci limbi în 2020. Angular, unul dintre cele mai mari cadre frontend, utilizează TypeScript. Aproximativ 60% dintre programatorii JS folosesc deja TypeScript, iar 22% doresc să încerce. De ce?

din punct de vedere istoric, JavaScript a ajuns ca limba principală pentru scriptarea paginilor web și a aplicațiilor de pe Internet. Acum este posibil să se utilizeze JavaScript pe ambele frontend și backend cu cadre cum ar fi Node.js și Deno.

dar JavaScript a fost creat pentru a crea sisteme mari și complexe precum cele de pe web-ul modern? Nu.

în acest articol, vă vom prezenta o soluție pentru asta-TypeScript-și vă vom începe calea de adăugare a tipurilor la codul dvs.

iată câteva dintre punctele pe care le vom acoperi:

• ce este TypeScript?
• ce sunt tipurile și cum funcționează în TS?
• JavaScript vs. TypeScript: care dintre ele să alegi?
• cum să începeți cu TypeScript.
• resurse suplimentare pentru studierea TypeScript.

ce este TypeScript?

pe scurt, TypeScript este un superset de JavaScript care are tastarea opțională și compilează JavaScript simplu.

în cuvinte mai simple, TypeScript punct de vedere tehnic este JavaScript cu tastarea statică, ori de câte ori doriți să-l aibă.

acum, care ar fi motivele pentru adăugarea tastării statice la JavaScript?

pot enumera cel puțin trei:

• puteți evita erorile ascunse-ascunse-ninja, cum ar fi clasicul 'undefined' is not a function.
• este mai ușor să refactorați codul fără a-l rupe semnificativ.
• orientarea în sisteme complexe, la scară largă, nu mai este un coșmar.

de fapt, un studiu arată că 15% din toate erorile JavaScript pot fi detectate prin TypeScript.

libertatea de tastare dinamică duce adesea la erori care nu numai că scad eficiența muncii programatorului, dar pot, de asemenea, să oprească dezvoltarea din cauza creșterii costurilor de adăugare a unor noi linii de cod.

prin urmare, eșecul JavaScript pentru a încorpora lucruri cum ar fi tipuri și verificări de eroare de compilare face o alegere proastă pentru cod server-side în întreprinderi și codebases mari. După cum spune sloganul lor, TypeScript este JavaScript care scalează.

ce trebuie să învăț să folosesc TypeScript?

TypeScript este în esență un JS linter. Sau, JS cu documentația pe care compilatorul o poate înțelege.

prin urmare, spre deosebire de alte limbi precum CoffeeScript (care adaugă zahăr sintactic) sau PureScript (care nu arată deloc ca JavaScript), nu este nevoie să învățați multe pentru a începe să scrieți cod TypeScript.

tipurile din TS sunt opționale și fiecare fișier JS este un fișier TypeScript valid. În timp ce compilatorul se va plânge dacă aveți erori de tip în fișierele inițiale, vă oferă înapoi un fișier JavaScript care funcționează așa cum a făcut-o înainte. Oriunde vă aflați, TypeScript vă va întâlni acolo și este ușor să vă construiți abilitățile treptat.

este folosit TypeScript pe frontend sau backend?

TypeScript este compilat în JavaScript. Prin urmare, TS poate fi folosit oriunde JS ar putea fi utilizate: atât frontend și backend.

JavaScript este cel mai popular limbaj pentru implementarea scripturilor pentru interfața aplicațiilor și a paginilor web. Astfel, TypeScript poate fi utilizat în același scop, dar strălucește în proiecte complexe de întreprindere pe partea de server.

la Serokell, cea mai mare parte a interfeței noastre web este implementată în TypeScript.

ce sunt tipurile și cum funcționează în TS?

scurtă introducere la tipuri

tipurile sunt o modalitate de a deosebi programele corecte de cele incorecte înainte de a le rula, descriind în codul nostru modul în care intenționăm să folosim datele noastre. Ele pot varia de la tipuri simple, cum ar fi numărul și șir de structuri complexe perfect modelate pentru domeniul nostru problemă.

limbajele de programare se împart în două categorii: tastate static sau tastate dinamic.

în limbile cu tastare statică, tipul variabilei trebuie să fie cunoscut la compilare. Dacă declarăm o variabilă, ar trebui să fie cunoscută (sau dedusă) de către compilator dacă va fi un număr, un șir sau un boolean. Gândiți-Vă Java.

în limbile cu tastare dinamică, acest lucru nu este neapărat așa. Tipul unei variabile este cunoscut numai la rularea programului. Gândește-Te La Python.

TypeScript poate suporta tastarea statică, în timp ce JavaScript nu.

datorită tastării statice a TypeScript, va trebui să încercați mai mult:

• introduceți variabile nedefinite (ajutor pentru avertismente în timp de compilare)
• sumați două șiruri care au numere în ele (cum ar fi „4” + „20” = „420”)
• efectuați operații pe lucruri care nu le permit, cum ar fi tăierea unui număr.

cu sisteme de tip static, puteți crea propriile tipuri compozite. Acest lucru permite inginerilor să-și exprime intențiile în detaliu.

tipuri explicite face, de asemenea, codul de auto-documentare: se asigură că variabilele și funcțiile dvs. se potrivesc cu ceea ce este destinat și permit computerului să aibă grijă să-și amintească contextul înconjurător.

tipuri de Dactilografiere

TypeScript are o varietate de tipuri de bază, cum ar fi Boolean, număr, șir, matrice, tuplu etc. Unele dintre acestea nu există în JS; puteți afla mai multe despre ele în documentația TypeScript.

pe lângă acestea, iată câteva alte tipuri pe care dorim să le prezentăm pentru a prezenta expresivitatea TS:

orice & necunoscut

în timp ce orice tip poate acoperi, bine, orice doriți, necunoscut este omologul său sigur de tip.

ori de câte ori doriți să scăpați de sistemul de tip, any vă permite să atribuiți orice variabilă JavaScript. Este frecvent utilizat pentru a modela variabilele primite (de la API-uri terțe, de exemplu) care nu au fost încă verificate și al căror tip este necunoscut.

Unknown este mult ca oricare altul, dar nu vă va permite să efectuați nicio operație pe variabilă înainte de a fi verificată în mod explicit.

gol

Void este utilizat atunci când nu există nicio valoare returnată, de exemplu, ca tip de returnare a funcțiilor care nu returnează nimic.

niciodată

niciodată nu este tipul de întoarcere pentru ceva care nu ar trebui să apară niciodată, ca o funcție care va arunca o excepție.

intersecție & tipuri de uniuni

acestea vă permit să creați tipuri personalizate pentru a se potrivi mai bine logica.

tipurile de intersecții vă permit să reuniți mai multe tipuri de bază într-un singur tip. De exemplu, puteți crea o persoană de tip particularizat care are un name: string și un phone_number: number. Este echivalent cu a spune: Vreau ca tipul meu să fie asta și asta.

tipurile de Uniune permit tipului dvs. să ia unul dintre mai multe tipuri de bază. De exemplu, puteți avea o interogare care returnează result: string sau undefined. Este echivalent cu a spune: Vreau ca tipul meu să fie unul sau altul.

dacă vă gândiți la tipuri ca spații, toate aceste tipuri au rapid sens.

tipurile din TypeScript pot fi atât implicite, cât și explicite. Dacă nu scrieți în mod explicit tipurile dvs., compilatorul va folosi inferența de tip pentru a deduce tipurile pe care le utilizați.

scrierea lor explicită, totuși, oferă beneficii cum ar fi ajutarea altor dezvoltatori care vă citesc codul și asigurarea faptului că ceea ce vedeți este ceea ce vede compilatorul.

TypeScript vs. JavaScript

merită să fii pragmatic. Aruncati o privire la acest grafic:

de nicăieri, TypeScript se află acum pe poziția a 7-A în cererile de tragere GitHub pentru Q1 2020, deasupra PHP și C. (sursă)

în timp ce o cauză considerabilă a acestui lucru este sprijinul TypeScript de companii precum Microsoft (care l-a creat) și Google, este acceptat dintr-un motiv întemeiat.

3 motive pentru a alege TypeScript peste JavaScript

1. TypeScript este mai fiabil

spre deosebire de JavaScript, codul TypeScript este mai fiabil și mai ușor de refactorizat. Acest lucru permite dezvoltatorilor să se sustragă erorilor și să rescrie mult mai ușor.

tipuri invalida cele mai multe dintre erorile stupide care pot strecura în JavaScript codebases, și de a crea o buclă de feedback rapid pentru a remedia toate micile greșeli atunci când scrieți cod nou și refactorizare.

2. TypeScript este mai explicit

explicitarea tipurilor ne concentrează atenția asupra modului în care este construit sistemul nostru și a modului în care diferite părți ale acestuia interacționează între ele. În sistemele la scară largă, este important să puteți abstractiza restul sistemului, ținând cont de context. Tipurile ne permit să facem asta.

3. TypeScript și JavaScript sunt practic interschimbabile, deci de ce nu?

deoarece JavaScript este un subset de TypeScript, puteți utiliza toate bibliotecile JavaScript și Codul dorit în codul TypeScript.

cele mai populare biblioteci JavaScript au tipuri în 2020 – cu siguranță tastat este un depozit cu tipuri pentru o mulțime de biblioteci JavaScript diferite pe care le puteți utiliza pentru a vă face interacțiunile cu ele mai sigure.

aceasta înseamnă că puteți adopta treptat TypeScript în baza de cod JavaScript, adăugând mai întâi tipuri la module individuale și apoi extinzându-vă pentru a… consuma universul cunoscut, cred.

dezavantaje ale dactilografiere

nu puteți lua doar o echipă JavaScript sau un depozit JavaScript și să le comutați instantaneu la idiomatic TypeScript. Există compromisuri și sacrificii de timp în avans pe care trebuie să le faceți.

în timp ce putem argumenta despre economiile pe care le oferă explicit tipurile pe termen lung, pe termen scurt, este nevoie de mai mult timp pentru a le adăuga. Acest lucru nu este, fără îndoială, o afacere uriașă, dar este un argument în favoarea JavaScript.

prin urmare, este posibil să nu alegeți TypeScript pentru proiecte mici și prototipuri pentru uz propriu.

teste vs. tipuri

pentru a atinge pe scurt discuția despre testare vs. tipuri: ambele lucruri prind diferite clase de bug-uri, deci are sens să le faci pe amândouă într-o manieră nepartizană.

puteți utiliza în continuare atât testarea unității, cât și tehnici mai avansate, cum ar fi testarea bazată pe proprietăți cu TS, păstrând în același timp beneficiile unui sistem de tip static.

pentru a rezuma, iată o comparație rapidă a ambelor limbi:

TypeScript	JavaScript
TS este un limbaj de scripting orientat pe obiecte	JS este un limbaj de scripting orientat pe obiecte
limbă dependentă (compilează JavaScript)	limbă independentă (poate fi interpretată și executată)
limbaj compilat, nu poate fi executat direct într-un browser	limbaj interpretat, executat direct într – un browser web
poate fi tastat static	tastat dinamic
mai bine structurat și concis	mai flexibil, deoarece nu sunteți limitat de sistemul de tip
are o .extensia ts	are un .extensie js
creat la Microsoft de Anders Hejlsberg (proiectant al C#) și întreținut de Microsoft	creat de Brendan Eich (Netscape) și întreținut de ECMA (European Computer Manufacturers Association).
o alegere corectă pentru proiecte complexe	bun pentru a lucra cu proiecte mici, simple

Ghid de pornire rapidă TypeScript

TypeScript compilator

TS, trebuie să instalați tsc(prescurtare pentru compilator TypeScript). Cel mai simplu mod de a face acest lucru este prin terminal. Acest lucru se poate face cu ușurință prin npm utilizând următoarea comandă:

npm install -g typescript

dacă doriți să utilizați TypeScript cu Visual Studio Code, există un ghid util pe site-ul lor.

după ce ați instalat tsc, puteți compila fișierele cu tsc filename.ts.

migrarea fișierelor de la JavaScript la TypeScript

să presupunem că dorim să schimbăm următorul fișier JavaScript în TypeScript din cauza comportamentului ciudat:

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

vești bune. Orice fișier JS este din punct de vedere tehnic un fișier TypeScript valid, deci aveți un început excelent – trebuie doar să comutați extensia fișierului la .ts din .js.

TypeScript are inferență de tip, ceea ce înseamnă că poate deduce automat unele dintre tipurile pe care le utilizați fără a le adăuga. În acest caz, se presupune că funcția însumează două variabile de tip orice, ceea ce este adevărat, dar nu are mare folos în acest moment.

dacă vrem să însumăm doar numere, putem adăuga o semnătură de tip la my_sum pentru a o face să accepte doar numere.

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

acum, TypeScript ne oferă o eroare.

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

bine că am găsit unde este eroarea. 🙂 Pentru a scăpa în continuare de erori ca acestea, puteți adăuga, de asemenea, definiții de tip la variabile.

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

TypeScript este destul de flexibil în ceea ce poate face și cum vă poate ajuta. Pentru un exemplu mai puțin banal despre cum să mutați baza de cod JavaScript existentă în TypeScript sau să utilizați TypeScript pentru a vă îmbunătăți codul JS, citiți acest ghid.

cum se utilizează TypeScript într-un browser?

pentru a rula TypeScript într-un browser, acesta trebuie transpus în JavaScript cu compilatorul TypeScript (tsc). În acest caz, tsc creează un nou .fișier js bazat pe .Cod ts, pe care îl puteți utiliza în orice mod puteți utiliza un fișier JavaScript.

resurse pentru învățarea ulterioară

TypeScript Deep Dive

această resursă web gratuită are tot ce aveți nevoie pentru a începe cu TypeScript, inclusiv explicații mai detaliate ale secțiunilor pe care le-am acoperit deja aici.

Aflați TypeScript De La Zero!

un curs practic de 3 ore care trece prin toate funcțiile de bază ale TypeScript, cum să îl utilizați pentru a interacționa cu unele cadre JS și cum să utilizați puterea TypeScript în timp ce scrieți JavaScript.

exerciții

exercitarea este cea mai bună resursă pentru a practica scrierea codului într-un nou limbaj de programare. Mentori care vă vor orienta spre codul idiomatic, o mulțime de sarcini practice distractive – nu este nimic de a nu iubi acest site web.

concluzii

în general, TypeScript este un instrument excelent pentru a avea în setul de instrumente, chiar dacă nu îl utilizați la capacitatea sa maximă. Este ușor să începi mic și să crești încet, învățând și adăugând noi funcții pe măsură ce mergi. TypeScript este pragmatic și primitor pentru începători, deci nu este nevoie să vă fie frică.

sper că acest articol va fi util în călătoria dvs. tipografică. Dacă doriți ajutor sau aveți câteva întrebări, asigurați-vă că le întrebați pe rețelele noastre sociale precum Twitter sau Facebook.