Learning TypeScript (part 2)

Photo by Deon Black on Unsplash

Welcome back to basics of TypeScript. Part 1 covered what Typescript is. Recap, TypeScript is a superset of JavaScript that adds a robust type system and object-oriented programming. In this article, I will give a look into the core types of TypeScript.

TypeScript can be viewed as JavaScript with type. This means we can specify types to different variables at the time of declaration. They will always hold the same type of data in that scope. This type checking helps to ensure our code works as expected and helps hunt down bugs and errors.

The Core Types

Different from JavaScript, we can define the types of our variables as number, string, Boolean, array, any and much more. The syntax to assign a type to any variable is to write the name of the variable followed by a : sign, and then the name of the type followed by a = sign and the value of the variable.

let num: number = 3 
Let fruit: string = ‘bananas’
Let inSmoothie: boolean = true

The number type is all numbers, there is no differentiation between integers or floats. The string type is all text values and boolean can only be true or false values.

The any type can be any kind of value. There is no specific type assignment. For example we can change a variable from a number to a string with no repercussions. If we use this type, it will override the type checking.

let ingredient: any = "blueberry"
ingredient = 7

For an array, we can declare a typed array by following the datatype with []. The element types can be flexible or strict to a certain type.

let favoriteFruits: string[] // an array of only strings
favoriteFruits = ['strawberry']
let favoriteFruits: any[] // an array with any types
favoriteFruits = ['strawberry', true]

Tuple is an added type to JavaScript by TypeScript. Tuple is a fixed element array where we can define the type of data that are stored in each position.

let recipe: [string, string, number]
recipe[0] = "blueberry"
recipe[1] = "orange"
recipe[2] = 3

Enum is an enumerated list where we can define a set of named predefined constants. Enums gives us constant identifiers to use that can give us a value. It is kind of like key value pairs.

enum Fruits {
Fruit1 = "banana",
Fruit2 = "orange",
Fruit3 = "strawberry"
}

Type Inference

TypeScript can generate the type without it being declared in most cases. For example, in creating a variable and assigning it to a particular value, TypeScript will use the value as its type. There is no problem without declaring a type to the variable, but it makes sure that type is exactly what is expected.

Resources

https://www.freecodecamp.org/news/learn-typescript-in-5-minutes-13eda868daeb/

https://www.educative.io/blog/typescript-tutorial#what

https://medium.com/@francesca.dreith/typescript-basics-types-and-basic-function-usage-319a4f37c01

https://www.section.io/engineering-education/typescript-static-typing/

beginner tutorial: https://www.youtube.com/watch?v=BwuLxPH8IDs