TypeScript Type Annotations

In this chapter, we will learn about TypeScript type annotations. Type annotations allow you to explicitly declare the types of variables, function parameters, and return values, providing better type safety and improving code readability. We will cover:

  • Introduction to Type Annotations
  • Type Annotations for Variables
  • Type Annotations for Functions
  • Type Annotations for Arrays
  • Type Annotations for Objects
  • Type Annotations for Tuples
  • Type Annotations for Enums
  • Examples of Using Type Annotations

Introduction to Type Annotations

Type annotations in TypeScript are used to explicitly declare the types of variables, function parameters, and return values. This helps catch type-related errors during development and provides better documentation for your code.

Benefits of Type Annotations

  • Type Safety: Helps catch type-related errors at compile time.
  • Code Readability: Makes the code easier to understand by explicitly stating the expected types.
  • Better Tooling: Enables better autocompletion and type-checking in IDEs.

Type Annotations for Variables

You can use type annotations to specify the type of a variable when it is declared.

Syntax

let variableName: type = value;

Example

let age: number = 30;
let name: string = "Ravi";
let isStudent: boolean = true;

Example Explanation

  • age is annotated as a number.
  • name is annotated as a string.
  • isStudent is annotated as a boolean.

Type Annotations for Functions

Type annotations can be used to specify the types of function parameters and the return type of the function.

Syntax

function functionName(parameterName: type): returnType {
  // function body
}

Example

function greet(name: string): string {
  return `Hello, ${name}!`;
}

Example Explanation

  • The name parameter is annotated as a string.
  • The function's return type is annotated as a string.

Type Annotations for Arrays

Type annotations can also be used to specify the types of elements in an array.

Syntax

let arrayName: type[] = [values];

Example

let numbers: number[] = [1, 2, 3, 4, 5];
let names: string[] = ["Ravi", "Sita", "Arjun"];

Example Explanation

  • numbers is an array of numbers.
  • names is an array of strings.

Type Annotations for Objects

Type annotations can be used to specify the types of properties in an object.

Syntax

let objectName: { propertyName: type, propertyName: type, ... } = { propertyName: value, propertyName: value, ... };

Example

let person: { name: string, age: number, isStudent: boolean } = {
  name: "Ravi",
  age: 30,
  isStudent: true
};

Example Explanation

  • person is an object with properties name, age, and isStudent annotated as string, number, and boolean, respectively.

Type Annotations for Tuples

Type annotations for tuples specify the types and order of elements in the tuple.

Syntax

let tupleName: [type, type, ...] = [value, value, ...];

Example

let employee: [number, string] = [1, "Ravi"];

Example Explanation

  • employee is a tuple where the first element is a number and the second element is a string.

Type Annotations for Enums

Enums are a way to define a set of named constants. Type annotations can be used with enums to enforce specific values.

Syntax

enum EnumName {
  CONSTANT1,
  CONSTANT2,
  ...
}

let variableName: EnumName = EnumName.CONSTANT;

Example

enum Color {
  Red,
  Green,
  Blue
}

let favoriteColor: Color = Color.Green;

Example Explanation

  • Color is an enum with constants Red, Green, and Blue.
  • favoriteColor is annotated as a Color enum and assigned the value Color.Green.

Examples of Using Type Annotations

Example 1: Annotating Variables

let city: string = "Mumbai";
let population: number = 20400000;
let isCapital: boolean = false;

Example 2: Annotating Functions

function add(a: number, b: number): number {
  return a + b;
}

let sum: number = add(5, 10);

Example 3: Annotating Arrays

let fruits: string[] = ["Apple", "Banana", "Mango"];

Example 4: Annotating Objects

let car: { brand: string, model: string, year: number } = {
  brand: "Toyota",
  model: "Camry",
  year: 2021
};

Example 5: Annotating Tuples

let book: [string, number] = ["The Alchemist", 1988];

Example 6: Annotating Enums

enum Direction {
  North,
  South,
  East,
  West
}

let travelDirection: Direction = Direction.North;

Conclusion

In this chapter, you learned about TypeScript type annotations, including how to annotate variables, functions, arrays, objects, tuples, and enums. Type annotations help improve type safety, code readability, and tooling support.

Comments

Spring Boot 3 Paid Course Published for Free
on my Java Guides YouTube Channel

Subscribe to my YouTube Channel (165K+ subscribers):
Java Guides Channel

Top 10 My Udemy Courses with Huge Discount:
Udemy Courses - Ramesh Fadatare