Share
După ce ați citit tutorialul introductiv tipcript, acum ar trebui să puteți scrie propriul cod TypeScript într-un IDE care îl acceptă și apoi îl compilați în JavaScript. În acest tutorial, veți afla despre diferite tipuri de tipuri de date disponibile în TypeScript.
JavaScript are șapte tipuri diferite de date: Null, Undefined, Boolean, Number, String, Symbol (introdus în ES6) și Object. TypeScript definește mai multe tipuri și toate acestea vor fi detaliate în acest tutorial.
La fel ca în JavaScript, nul tipul de date din TypeScript poate avea o singură valoare validă: nul. O variabilă nulă nu poate conține alte tipuri de date, cum ar fi numărul și șirul. Dacă setați o variabilă la null, va șterge conținutul acesteia dacă ar exista.
Amintiți-vă că atunci când strictNullChecks steagul este setat la Adevărat în tsconfig.json, numai valoarea null este asignabilă la variabilele cu null. Acest steguleț este dezactivat în mod implicit, ceea ce înseamnă că puteți atribui, de asemenea, valoarea nulă variabilelor cu alte tipuri, cum ar fi număr sau vid.
// Cu strictNullChecks setat la true let a: null = null; / / Ok lasă b: undefined = null; // Eroare let c: number = null; // Eroare let d: void = null; // Eroare // Cu strictNullChecks setat la false lăsați a: null = null; / / Ok lasă b: undefined = null; // Ok, lăsați c: number = null; // Ok dați d: void = null; // O.K
Orice variabilă a cărei valoare nu ați specificat este setată la nedefinit. Cu toate acestea, puteți seta explicit tipul de variabilă la nedefinit, ca în exemplul următor.
Rețineți că o variabilă cu tip setat la nedefinit poate fi doar nedefinit ca valoare. În cazul în care strictNullChecks opțiunea este setată la fals, va fi, de asemenea, posibilitatea de a atribui nedefinit la variabilele cu numere și tipuri de șir, etc.
// Cu strictNullChecks setat la true let a: undefined = undefined; / / Ok lasă b: undefined = null; // Eroare let c: number = undefined; // Eroare let d: void = undefined; // Ok // Cu strictNullChecks setat la false lăsați a: undefined = undefined; / / Ok lasă b: undefined = null; // Ok, lăsați c: number = undefined; // Ok dați d: void = undefined; // O.K
Tipul de date void este folosit pentru a indica lipsa unui a tip pentru o variabilă. Setarea variabilelor pentru a avea a vid tip poate să nu fie foarte util, dar puteți seta tipul de retur de funcții care nu returnează nimic vid. Atunci când se utilizează cu variabile, tipul vid pot avea numai două valori valide: nul și nedefinit.
// Cu strictNullChecks setat la true let a: void = undefined; // Ok, lasă b: void = null; // Eroare let c: void = 3; // Eroare lasă d: void = "apple"; // Eroare // Cu strictNullChecks setat la false let a: void = undefined; // Ok, lasă b: void = null; // Ok, lăsați c: void = 3; // Eroare lasă d: void = "apple"; // Eroare
spre deosebire de număr și şir tipuri de date, boolean are doar două valori valide. Puteți să vă setați valoarea la oricare dintre acestea Adevărat sau fals. Aceste valori sunt folosite foarte mult în structurile de control unde se execută o singură bucată de cod dacă este o condiție Adevărat și o altă bucată de cod este executată dacă este o condiție fals.
Iată un exemplu foarte simplu de declarare a variabilelor booleene:
permiteți a: boolean = true; b: boolean = false; permiteți c: boolean = 23; // Eroare let d: boolean = "albastru"; // Eroare
număr tipul de date este utilizat pentru a reprezenta atât valorile întregi, cât și valorile în virgulă mobilă, atât în JavaScript, cât și în Tip. Cu toate acestea, trebuie să vă amintiți că toate numerele sunt reprezentate intern ca valori în virgulă mobilă. Numerele pot fi specificate și ca literalmente hexazecimal, octal sau binar. Rețineți că reprezentările octale și binare au fost introduse în ES6, iar acest lucru poate duce la ieșiri diferite de cod JavaScript bazate pe versiunea pe care o vizați.
Există, de asemenea, trei valori suplimentare simbolice speciale care se încadrează în categoria număr tip: +Infinit, -Infinit, și NaN. Iată câteva exemple de utilizare a număr tip.
// Cu strictNullChecks setat la true let a: number = undefined; // Eroare let b: number = null; // Eroare let c: number = 3; d: numărul = 0b111001; // Permite binar e: number = 0o436; / / Octal let f: number = 0xadf0d; // Hexadecimal lăsați g: number = "cat"; // Eroare // Cu strictNullChecks setat la false let a: number = undefined; // Ok b la b: number = null; // Ok da c: numărul = 3; d: numărul = 0b111001; // Permite binar e: number = 0o436; / / Octal let f: number = 0xadf0d; // Hexadecimal lăsați g: number = "cat"; // Eroare
Când versiunea țintă este setată la ES6, codul de mai sus se va compila la următorul cod JavaScript:
let a = undefined; b = null; c = 3; permiteți d = 0b111001; dați e = 0o436; let f = 0xadf0d; lasă g = "pisică";
Trebuie să rețineți că variabilele JavaScript sunt încă declarate utilizând lăsa, care a fost introdus în ES6. De asemenea, nu vedeți mesaje de eroare legate de tip de variabile diferite, deoarece codul JavaScript nu are cunoștințe despre tipurile pe care le-am utilizat în codul TypeScript.
Dacă versiunea țintă este setată la ES5, codul TypeScript pe care l-am scris mai devreme se va compila la următorul cod JavaScript:
var a = nedefinit; var b = nul; var c = 3; var d = 57; var e = 286; var f = 0xadf0d; var g = "pisică";
După cum puteți vedea, de data aceasta toate evenimentele lăsa cuvântul cheie a fost modificat var. De asemenea, rețineți că numerele octale și binare au fost modificate în formele lor zecimale.
Tipul de date pentru șir este folosit pentru a stoca informații textuale. Atât JavaScript, cât și TypeScript folosesc citate duble (") și citate simple (') pentru a înconjura informațiile dvs. textuale ca șir. Un șir poate conține zero sau mai multe caractere închise în citate.
// Cu strictNullChecks setat la true let a: string = undefined; // Eroare lasa b: string = null; // Eroare lasa c: string = ""; permiteți d: string = "y"; permiteți e: string = "construirea"; lasati f: string = 3; // Eroare lasă g: string = "3"; // Cu strictNullChecks setat la false lasa a: string = undefined; // Ok lasă b: string = null; // Ok lasă c: string = ""; permiteți d: string = "y"; permiteți e: string = "construirea"; lasati f: string = 3; // Eroare lasă g: string = "3";
De asemenea, TypeScript acceptă șirul de șabloane sau literalul șablonului. Aceste literali de șabloane vă permit să încorporați expresii într-un șir. Șabloanele literaturii sunt închise de caracterul din spate (') în loc de ghilimele duble și de citatele simple care cuprind șirurile regulate. Acestea au fost introduse în ES6. Aceasta înseamnă că veți obține o ieșire JavaScript diferită bazată pe versiunea pe care o vizați. Iată un exemplu de folosire a literalurilor de șabloane în TypeScript:
permiteți e: string = "construirea"; f: numărul = 300; let sentence: string = '$ e în fața biroului meu este $ f picioare înălțime.';
La compilație, veți primi următorul cod JavaScript:
// Producția în ES5 var e = "clădire"; var f = 300; var sentence = "" + e + "în fața biroului meu este" + f + "picioare inalte."; // Producția în ES6 let e = "construirea"; let f = 300; let sentence = '$ e în fața biroului meu este $ f picioare înălțime.';
După cum puteți vedea, șablonul literal a fost schimbat la un șir regulat în ES5. Acest exemplu arată modul în care TypeScript vă permite să utilizați toate funcțiile JavaScript cele mai recente, fără a vă îngrijora de compatibilitate.
Puteți defini tipurile de matrice în două moduri diferite în JavaScript. În prima metodă, specificați tipul de elemente de matrice urmate de [] care denotă o matrice de acest tip. O altă metodă este folosirea tipului de matrice generică mulțime. Următorul exemplu arată modul de creare a unor tabele cu ambele metode. specificarea nul sau nedefinit deoarece unul dintre elementele va produce erori atunci când strictNullChecks steagul este Adevărat.
// Cu strictNullChecks setat la false lăsați: numărul [] = [1, 12, 93, 5]; lăsați b: șir [] = ["a", "caisă", "mango"]; lăsați c: numărul [] = [1, "măr", "cartof"]; // Eroare lasă d: Array= [nul, nedefinit, 10, 15]; permiteți e: Array = ["plăcintă", nulă, ""]; // Cu strictNullChecks setat la adevărat lăsați: numărul [] = [1, 12, 93, 5]; lăsați b: șir [] = ["a", "caisă", "mango"]; lăsați c: numărul [] = [1, "măr", "cartof"]; // Eroare lasă d: Array = [nul, nedefinit, 10, 15]; // Eroare let e: Array = ["plăcintă", nulă, ""]; // Eroare
Tipul de date de tip tuple vă permite să creați o matrice în care tipul de număr fixat de elemente este cunoscut în prealabil. Tipul celorlalte elemente poate fi doar unul dintre tipurile pe care le-ați specificat deja pentru tuplă. Iată un exemplu care va face mai clară:
permiteți: [număr, șir] = [11, "luni"]; lasă b: [număr, șir] = ["luni", 11]; // Eroare lasă c: [număr, șir] = ["a", "maimuță"]; // Eroare lasă d: [număr, șir] = [105, "owl", 129, 45, "cat"]; e: [număr, șir] = [13, "bat", "spiderman", 2]; e [13] = "elefant"; e [15] = fals; // Eroare
Pentru toate tuplurile din exemplul nostru, am setat tip al primului element la a număr si tip al celui de-al doilea element la a şir. Deoarece am specificat doar a tip pentru primele două elemente, restul acestora poate fi un șir sau un număr. Crearea de tuple b și c duce la o eroare deoarece am încercat să folosim un șir ca valoare pentru primul element când am menționat că primul element ar fi un număr.
În mod similar, nu putem seta valoarea unui element puc la fals după ce specificați că va conține numai șiruri de caractere și numere. De aceea, ultima linie are drept rezultat o eroare.
enum tipul de date este prezent în multe limbi de programare precum C și Java. Acesta a fost lipsit de la JavaScript, dar TypeScript vă permite să creați și să lucrați cu enums. Dacă nu știți ce enums sunt, vă permit să creați o colecție de valori asociate folosind nume memorabile.
enum Animale pisică, leu, câine, vacă, maimuță let c: Animals = Animals.cat; console.log (Animale [3]); // cow console.log (Animals.monkey); // 4
În mod prestabilit, numerotarea enumurilor începe la 0, dar puteți seta manual o altă valoare pentru primul sau oricare alt membru. Aceasta va schimba valoarea tuturor membrilor care le urmează, prin creșterea valorii lor cu 1. Puteți seta toate valorile manual într-un enum.
enum Animale cat = 1, leu, câine = 11, vacă, maimuță lăsați c: Animals = Animals.cat; console.log (Animale [3]); // undefined console.log (Animals.monkey); // 13
Spre deosebire de exemplul anterior, valoarea lui Animale [3] este nedefinit de data asta. Acest lucru se datorează faptului că valoarea 3 ar fi fost atribuită câinelui, dar ne-am stabilit în mod explicit valoarea lui 11. Valoarea pentru vacă rămâne la 12 și nu 3, deoarece valoarea ar trebui să fie una mai mare decât valoarea ultimului membru.
Să presupunem că scrieți un program în care valoarea unei variabile este determinată de utilizatori sau de codul scris într-o bibliotecă terță parte. În acest caz, nu veți putea seta corect tipul de variabilă. Variabila ar putea fi de orice tip ca un șir, un număr sau un boolean. Această problemă poate fi rezolvată utilizând orice tip. Acest lucru este de asemenea util atunci când creați tablouri cu elemente de tip mixt.
o a: any = "apple"; b: orice = 14; c: any = false; d: orice [] = ["ușă", "bucătărie", 13, falsă, nulă); b = "oameni";
În codul de mai sus, am putut să atribui un număr b și apoi modificați valoarea sa la un șir fără a obține nici o eroare din cauza tipului orice poate accepta toate tipurile de valori.
nu tip este folosit pentru a reprezenta valori care nu trebuie să apară niciodată. De exemplu, puteți atribui nu ca tip de returnare a unei funcții care nu revine niciodată. Acest lucru se poate întâmpla atunci când o funcție aruncă întotdeauna o eroare sau când este blocată într-o buclă infinită.
lasa-o: niciodata; // Ok b b: niciodată = false; // Eroare lasa c: niciodata = nula; // Eroare let d: never = "luni"; // Funcția de eroare a rămas (): niciodată while (true)
Acest tutorial vă prezintă toate tipurile disponibile în TypeScript. Am aflat că atribuirea unui tip diferit de valoare unei variabile va afișa erori în tipul de tipcript. Această verificare vă poate ajuta să evitați multe erori atunci când scrieți programe mari. De asemenea, am învățat cum să vizăm diferite versiuni ale JavaScript.
Dacă sunteți în căutarea unor resurse suplimentare pentru a studia sau a utiliza în munca dvs., verificați ce avem la dispoziție pe piața Envato.
În tutorialul următor, veți afla despre interfețe în formatul tip. Dacă aveți întrebări legate de acest tutorial, anunțați-ne în comentarii.
Accentsconagua