Efter att ha läst den inledande TypeScript-handledningen bör du nu kunna skriva en egen TypeScript-kod i en IDE som stöder den och sedan kompilera den till JavaScript. I den här handledningen lär du dig information om olika typer av datatyper som finns tillgängliga i TypeScript.
JavaScript har sju olika datatyper: Null, Undefined, Boolean, Number, String, Symbol (introducerad i ES6) och Objekt. TypeScript definierar några fler typer, och alla kommer att beskrivas i detalj i denna handledning.
Precis som i JavaScript, den null
datatyp i TypeScript kan bara ha ett giltigt värde: null
. En nollvariabel kan inte innehålla andra datatyper som nummer och sträng. Om du ställer in en variabel till noll raderas innehållet om det hade något.
Kom ihåg att när strictNullChecks
flaggan är inställd på Sann
i tsconfig.json, endast värdet null kan tilldelas variabler med null typ. Den här flaggan är avstängd som standard, vilket betyder att du också kan tilldela nollvärdet till variabler med andra typer som siffra
eller ogiltig
.
// Med strictNullChecks satt till true låt a: null = null; // Ok låt b: undefined = null; // Fel låt c: number = null; // Fel låt d: void = null; // Fel // Med strictNullChecks satt till false låt a: null = null; // Ok låt b: undefined = null; // Ok låt c: number = null; // Ok låt d: void = null; // Ok
Varje variabel vars värde du inte har angett är inställt på odefinierad
. Du kan dock också uttryckligen ange typen av en variabel till odefinierad, som i följande exempel.
Tänk på att en variabel med typ
satt till odefinierad
kan bara ha odefinierat som sitt värde. Om strictNullChecks
alternativet är inställt på falsk
, Du kommer också att kunna tilldela odefinierad
till variabler med nummer och strängtyper, etc..
// Med strictNullChecks satt till true låt a: undefined = undefined; // Ok låt b: undefined = null; // Fel låt c: number = undefined; // Fel låt d: void = undefined; // Ok // Med strictNullChecks satt till false låt a: undefined = undefined; // Ok låt b: undefined = null; // Ok låt c: number = odefinierat; // Ok låt d: void = undefined; // Ok
Tomtdatatypen används för att indikera bristen på a typ
för en variabel. Ställ in variabler för att ha a ogiltig
typen kan inte vara mycket användbar, men du kan ställa in returtypen av funktioner som inte returnerar något till ogiltig
. När den används med variabler, typen ogiltig
kan bara ha två giltiga värden: null
och odefinierad
.
// Med strictNullChecks satt till true låt a: void = undefined; // Ok låt b: void = null; // Fel låt c: void = 3; // Fel låt d: void = "apple"; // Fel // Med strictNullChecks satt till false låt a: void = undefined; // Ok låt b: void = null; // Ok låt c: void = 3; // Fel låt d: void = "apple"; // Fel
till skillnad från siffra
och sträng
datatyper, boolean
har bara två giltiga värden. Du kan bara ange sitt värde till antingen Sann
eller falsk
. Dessa värden används mycket i kontrollstrukturer där ett stycke kod utförs om ett villkor är Sann
och ett annat kodstycke utförs om ett villkor är falsk
.
Här är ett mycket grundläggande exempel på att deklarera boolesiska variabler:
låt a: boolean = true; låt b: boolean = false; låt c: boolean = 23; // Fel låt d: boolean = "blue"; // Fel
De siffra
datatyp används för att representera både heltal och flytpunktsvärden i både JavaScript och TypeScript. Du bör dock komma ihåg att alla siffror är internt representerade som flytande punktvärden. Nummer kan också anges som hexadecimal, oktal eller binär bokstav. Tänk på att Octal och Binära representationer introducerades i ES6, och detta kan resultera i olika JavaScript-kodutgång baserat på den version du riktar in.
Det finns också tre extra speciella symboliska värden som faller under siffra
typ: +Oändlighet
, -Oändlighet
, och NaN
. Här är några exempel på hur du använder siffra
typ.
// Med strictNullChecks satt till true låt a: number = undefined; // Fel låt b: nummer = null; // Fel låt c: nummer = 3; låt d: tal = 0b111001; // Binär låt e: nummer = 0o436; // Octal låt f: tal = 0xadf0d; // Hexadecimal låt g: number = "cat"; // Fel // Med strictNullChecks satt till false låt a: number = undefined; // Ok låt b: nummer = null; // Ok, låt c: nummer = 3; låt d: tal = 0b111001; // Binär låt e: nummer = 0o436; // Octal låt f: tal = 0xadf0d; // Hexadecimal låt g: number = "cat"; // Fel
När målversionen är inställd på ES6 kommer den ovanstående koden att kompileras till följande JavaScript:
låt a = odefinierad; låt b = null; låt c = 3; låt d = 0b111001; låt e = 0o436; låt f = 0xadf0d; låt g = "katt";
Du bör notera att JavaScript-variablerna fortfarande är deklarerade med låta
, som introducerades i ES6. Du ser inte några felmeddelanden som är relaterade till typ
av olika variabler eftersom JavaScript-koden inte känner till vilka typer vi använde i TypeScript-koden.
Om målversionen är inställd på ES5, kommer den typScript-kod som vi skrev tidigare att kompilera för att följa JavaScript:
var a = odefinierad; var b = null; var c = 3; var d = 57; var e = 286; var f = 0xadf0d; var g = "katt";
Som du kan se, denna gång alla händelser av låta
sökordet har ändrats till var
. Observera också att de oktala och binära talen har ändrats till deras decimalform.
Strängdatatypen används för att lagra textinformation. Både JavaScript och TypeScript använder dubbla citat (") samt enkla citat (') för att omge din textinformation som en sträng. En sträng kan innehålla noll eller flera tecken bifogade citat.
// Med strictNullChecks satt till true låt a: string = undefined; // Fel låt b: sträng = null; // Fel låt c: sträng = ""; låt d: sträng = "y"; låt e: string = "building"; låt f: sträng = 3; // Fel låt g: sträng = "3"; // Med strictNullChecks satt till false låt a: string = undefined; // Ok låt b: sträng = null; // Ok, låt c: sträng = ""; låt d: sträng = "y"; låt e: string = "building"; låt f: sträng = 3; // Fel låt g: sträng = "3";
TypeScript stöder också mallsträngar eller mallstavlar. Dessa mallstavlar tillåter dig att bädda in uttryck i en sträng. Mall bokstäver är bifogade av back-tick karaktären ('
) istället för dubbla citat och enkla citat som bifogar vanliga strängar. De introducerades i ES6. Det innebär att du får olika JavaScript-utgåva baserat på vilken version du riktar in. Här är ett exempel på att använda mallstavlar i TypeScript:
låt e: string = "building"; låt f: tal = 300; låt dom: string = '$ e framför mitt kontor är $ f meter lång.';
Vid sammanställning får du följande JavaScript:
// Utgång i ES5 var e = "byggnad"; var f = 300; var sentence = "Den" + e + "framför mitt kontor är" + f + "fötter långa."; // Utgång i ES6 låt e = "byggnad"; låt f = 300; låt sentence = '$ e framför mitt kontor är $ f meter lång.';
Som du kan se ändrades mallen bokstavligt till en vanlig sträng i ES5. I det här exemplet visas hur TypScript gör det möjligt för dig att använda alla de senaste JavaScript-funktionerna utan att oroa dig för kompatibilitet.
Du kan definiera array typer på två olika sätt i JavaScript. I den första metoden anger du vilken typ av arrayelement som följs av []
vilket betecknar en uppsättning av den typen. En annan metod är att använda den generiska array typen Array
. I följande exempel visas hur man skapar arrayer med båda dessa metoder. Ange null
eller odefinierad
som ett av elementen kommer att ge upphov till fel när strictNullChecks
flagga är Sann
.
// Med strictNullChecks satt till false, låt a: nummer [] = [1, 12, 93, 5]; låt b: sträng [] = ["a", "aprikos", "mango"]; låt c: tal [] = [1, "äpple", "potatis"]; // Fel låt d: Array= [null, odefinierad, 10, 15]; låt e: Array = ["paj", null, ""]; // Med strictNullChecks satt till true låt a: number [] = [1, 12, 93, 5]; låt b: sträng [] = ["a", "aprikos", "mango"]; låt c: tal [] = [1, "äpple", "potatis"]; // Fel låt d: Array = [null, odefinierad, 10, 15]; // Fel låt e: Array = ["paj", null, ""]; // Fel
Tuple-datatypen kan du skapa en array där typen av ett fast antal element är känt i förväg. Typen av resten av elementen kan bara vara en av de typer som du redan har angett för tupeln. Här är ett exempel som gör det tydligare:
låt a: [nummer, sträng] = [11, "måndag"]; låt b: [nummer, sträng] = ["måndag", 11]; // Fel låt c: [nummer, sträng] = ["a", "apa"]; // Fel låt d: [nummer, sträng] = [105, "uggla", 129, 45, "katt"]; låt e: [nummer, sträng] = [13, "fladdermus", "spiderman", 2]; e [13] = "elefant"; e [15] = false; // Fel
För alla tuplar i vårt exempel har vi satt typ
av det första elementet till a siffra
och den typ
av det andra elementet till a sträng
. Eftersom vi bara har angett a typ
För de två första elementen kan resten av dem vara en sträng eller ett tal. Skapa tuples b
och c
resulterar i ett fel eftersom vi försökte använda en sträng som ett värde för det första elementet när vi hade nämnt att det första elementet skulle vara ett tal.
På samma sätt kan vi inte ange värdet av ett tupleelement till falsk
efter att ha angett att det bara kommer att innehålla strängar och siffror. Det är därför som den sista raden resulterar i ett fel.
De enum
datatyp finns i många programmeringsspråk som C och Java. Det har saknats från JavaScript, men TypeScript låter dig skapa och arbeta med enums. Om du inte vet vad enums
De tillåter dig att skapa en samling relaterade värden med minnesvärda namn.
enum Djur katt, lejon, hund, ko, apa låt c: Djur = Djur.cat; console.log (Djur [3]); // cow console.log (Animals.monkey); // 4
Som standard börjar numreringen av enums vid 0, men du kan också ange ett annat värde manuellt för de första eller andra medlemmarna. Detta kommer att ändra värdet av alla medlemmar som följer dem genom att öka deras värde med 1. Du kan också ställa in alla värden manuellt i en enum
.
enum Djur cat = 1, lejon, hund = 11, ko, apa låt c: Djur = Djur.cat; console.log (Djur [3]); // odefinierad console.log (Animals.monkey); // 13
Till skillnad från föregående exempel, värdet av Djur [3]
är odefinierad
den här gången. Detta beror på att värdet 3 skulle ha tilldelats hunden, men vi bestämde uttryckligen sitt värde till 11. Värdet för ko stannar vid 12 och inte 3 eftersom värdet ska vara en större än värdet av det sista medlemmet.
Låt oss säga att du skriver ett program där värdet av en variabel bestäms av användarna eller koden som skrivs i ett tredje part bibliotek. I det här fallet kommer du inte att kunna ställa in typen av variabeln korrekt. Variabeln kan vara av någon typ som en sträng, ett tal eller en booleska. Detta problem kan lösas med hjälp av några
typ. Detta är också användbart när du skapar arrayer med element av blandade typer.
låt a: any = "apple"; låt b: någon = 14; låt c: any = false; låt d: någon [] = ["dörr", "kök", 13, fel, null]; b = "människor";
I ovanstående kod kunde vi tilldela ett nummer till b
och ändra dess värde till en sträng utan att få något fel eftersom typen några
kan acceptera alla typer av värden.
De aldrig
typ används för att representera värden som aldrig ska inträffa. Till exempel kan du tilldela aldrig
som returtyp för en funktion som aldrig återkommer. Detta kan hända när en funktion alltid kasta ett fel eller när det fastnar i en oändlig slinga.
låt a: aldrig; // Ok låt b: aldrig = false; // Fel låt c: aldrig = null; // Fel låt d: aldrig = "måndag"; // Felfunktion fast (): aldrig while (true)
Denna handledning introducerade dig till alla typer som finns tillgängliga i TypeScript. Vi lärde oss hur att tilldela en annan typ av värde till en variabel visar fel i TypeScript. Denna kontroll kan hjälpa dig att undvika många fel när du skriver stora program. Vi lärde oss också att rikta in olika versioner av JavaScript.
Om du letar efter ytterligare resurser att studera eller använda i ditt arbete, kolla vad vi har tillgängligt på Envato-marknaden.
I nästa handledning lär du dig information om gränssnitt i TypeScript. Om du har några frågor relaterade till denna handledning, låt mig veta i kommentarerna.