DEV Community

Dharan Ganesan
Dharan Ganesan

Posted on

Day 37: Types

In this article, we'll take a dive into TypeScript types, exploring the built-in types, advanced type concepts, and examples. Let's get started! 🎉

Basic Types 📚

1. number 🔢

Represents numeric values like integers and floating-point numbers.

let age: number = 25; 
Enter fullscreen mode Exit fullscreen mode

2. string 🔡

Denotes textual data, typically enclosed in single or double quotes.

let name: string = "Alice"; 
Enter fullscreen mode Exit fullscreen mode

3. boolean ✅❌

Represents true or false values.

let isActive: boolean = true; 
Enter fullscreen mode Exit fullscreen mode

4. any 🌌

A flexible type that allows dynamic types, similar to plain JavaScript.

let dynamicValue: any = 42; dynamicValue = "Hello!"; 
Enter fullscreen mode Exit fullscreen mode

5. void 🌫️

Used for functions that don't return a value.

function logMessage(): void { console.log("Logged!"); } 
Enter fullscreen mode Exit fullscreen mode

6. null and undefined 🚫

Denote the absence of a value. They are separate types and can be assigned to their respective types.

let maybeNull: null = null; let maybeUndefined: undefined = undefined; 
Enter fullscreen mode Exit fullscreen mode

7. never

Represents values that never occur, often used for functions that throw exceptions or enter infinite loops.

function throwError(message: string): never { throw new Error(message); } 
Enter fullscreen mode Exit fullscreen mode

8. Object 🏛️

Represents non-primitive types, i.e., anything that is not a number, string, boolean, null, or undefined.

let person: object = { name: "Bob", age: 30 }; or let person: Record<string, string> = { name: "Bob" }; or let person: { name: string } = { name: "Bob" }; 
Enter fullscreen mode Exit fullscreen mode

9. symbol 🔑

Creates unique and immutable values, often used as object property keys.

const uniqueKey: symbol = Symbol("unique"); 
Enter fullscreen mode Exit fullscreen mode

10. Enumerated types (enum) 🌈

A set of named constant values, great for improving code readability.

enum Color { Red, Green, Blue, } let chosenColor: Color = Color.Green; 
Enter fullscreen mode Exit fullscreen mode

11. Tuple types 📦

Allows defining an array with fixed types and known lengths.

let person: [string, number] = ["Alice", 25]; 
Enter fullscreen mode Exit fullscreen mode

12. Array types 📚

Denotes arrays of a specific type.

let numbers: number[] = [1, 2, 3, 4, 5]; 
Enter fullscreen mode Exit fullscreen mode

13. Type aliases ✍️

Create custom names for types, making complex types more readable.

type Point = { x: number; y: number }; let coordinates: Point = { x: 10, y: 20 }; 
Enter fullscreen mode Exit fullscreen mode

Advanced Type 🌟

Union Types 🌐

Combining multiple types using the | operator.

let value: string | number = "Hello"; value = 42; 
Enter fullscreen mode Exit fullscreen mode

Intersection Types ⚓

Combining multiple types into one, resulting in the presence of all properties from each type.

type Nameable = { name: string }; type Ageable = { age: number }; type Person = Nameable & Ageable; let person: Person = { name: "Alice", age: 30 }; 
Enter fullscreen mode Exit fullscreen mode

Example 🚀

1. Function Signature ✍️

Define a function signature using a type.

type MathOperation = (a: number, b: number) => number; const add: MathOperation = (a, b) => a + b; 
Enter fullscreen mode Exit fullscreen mode

2. Different Type 🗃️

Using type unions to handle different data structures.

type DataStructure = string[] | number[] | object[]; function printLength(data: DataStructure) { console.log(data.length); } 
Enter fullscreen mode Exit fullscreen mode

Top comments (0)