Typescript - Data Types
Arsalan Khattak
Posted on August 8, 2020
Types are the most basics of every programming language. So, let's start looking into Typescript's data types
Booleans
Booleans are the most basic data type with just two values true
or false
. In typescript, we define typescript as
let isAuthenticated: boolean = false;
The extra part : boolean
is a variable type.
Numbers
To define a variable which has type number, we simply have to add : number
before the assignment operator
let num: number = 5;
If you change its value from 5
to "5"
, Typescript will give an error Type '"5"' is not assignable to type 'number'
because this variable can now only hold numbers.
It can also hold Floating, binary , hexadecimal, octal numbers.
Strings
By now, I am sure you know the basic syntax for Typescript variables. We can declare strings as
let name: string = "Arsalan";
You can also use single quotes
let name: string = 'Arsalan';
Null and Undefined
In Typescript, we have other types known as null and undefined and we can declare them as
let somethingNull: null = null;
let somethingUndefined: undefined = undefined;
These two variables will always be null
and undefined
and you can't change them. They are not extremely useful on their own but there are some cases where they come in handy. For example, if you are trying to fetch a value from somewhere and that value is either string or null, in that case, you can declare a variable that can be string or null.
let fetchedValue: string | null;
If you try assigning null
or undefined
to a variable which must be of type string
, you will see it works, e.g.
let thisWorks: string = null;
That's because Typescript avoids null
and undefined
because these two types are subtypes of string
, number
etc.
To avoid this behavior, and show an error, you can add this one line to your compilerOptions
in tsconfig.json
"strictNullChecks": true
Array
Letโs talk about some non-primitive types such as Arrays and Objects. For Arrays, we have to add square brackets after the type
For example, if we want to want to have an array of numbers
let numArr: number[] = [1,2,3,4,5];
Similarly, for Strings
let names: string[] = ["John", "Lisa", "Smith"];
There is also a second way to declare arrays, by using Array<elementType>
let names: Array<String> = ["John", "Lisa", "Smith"];
Tuple
Tuple is something you never heard of in javascript, In javascript, we donโt define the length of our arrays, because we can not, Tuple helps us to express the length of our arrays. Here's a simple example of Tuple
let numbers: [number,number] = [1,2];
If you try to add any additional item to names
array, you will get an array
let numbers: [number,number] = [1,2,3];
// Error: Type '[number, number, number]' is not assignable to type '[number, number]'
but this will work still work
let numbers: [number, number] = [1, 2];
numbers.push(2);
That's because type safety doesn't work with .push()
.
You can also have an array of fixed length which can store different types. For example,
let mixed: [number, string, number] = [1, "Two", 3]
Objects
We have covered most of the things, let's talk about the most interesting type, Objects. Here's a simple object declared in Typescript.
let obj: object = {
val: 4,
foo: "bar"
}
We will talk more about Objects in upcoming blogs when you learn some more Typescript.
Enum
If you have worked with C# or Java, you are most likely familiar with Enum
. They are a set of predefined constant values. A simple example of Enum
is
enum Days {
Monday,
Tuesday,
Wednesday,
Thursday,
Friday,
Saturday,
Sunday,
}
let satur: Days = Days.Saturday; // 5
Enums can also be accessed by their index.
enum Days {
Monday,
Tuesday,
Wednesday,
Thursday,
Friday,
Saturday,
Sunday,
}
let sat: string = Days[6]; // Sunday
By default, enum starts with an index 0 but we can modify their index. For example
enum Days {
Monday,
Tuesday,
Wednesday,
Thursday,
Friday,
Saturday,
Sunday = 10,
}
let sat: string = Days[10]; // Sunday
In the above example, Sunday
has an index of 10
.
Any
At this point, you learned all the primitive and non-primitive types that exist in Javascript. But, you might be wondering how can I have a variable which can accept any value? Is there any way to declare such a variable in Typescript? The good news is YES, there is a way to declare such a variable.
let giveMeAnyValue: any = 1;
giveMeAnyValue = "Two";
giveMeAnyValue = [1,"Two"];
giveMeAnyValue = {
one: 1,
two: "Two"
}
The above code snippet will work fine because we specified its type as any
, which means this variable can have any type.
This also works for Tuple
let arrayOfUnknownTypes: [any, any, any] = [1,2,3];
arrayOfUnknownTypes = ["One", 2, "Three"]
If you are not sure about the type, you can use any.
Never
One other type, we can use is never
which means no value.
let dontGiveMeValue: never = 1;
The above example will give you an error Type '1' is not assignable to type 'never'.
. That's because it will not accept any value at all.
This never
is used as the return type for those functions which always throw an error or which goes into an infinite loop.
function dontWork (): never {
throw Error("You FAILED!")
}
This was all about Typescript Data Types. You can take advantage of these static types to avoid javascript coercions if you don't like them.
Posted on August 8, 2020
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
November 28, 2024
October 16, 2024