What is Type Inference?

Type inference is a feature in TypeScript that automatically determines the type of a variable or expression based on its value.

For example, when you write let age = 25;, TypeScript infers that age is of type number.

Benefits of Type Inference

Type inference reduces the need to explicitly declare types, making your code cleaner and easier to write.

It also helps TypeScript catch errors during development, ensuring type safety without adding extra annotations.

Examples of Type Inference

Here are some examples: 

• let message = 'Hello'; - TypeScript infers the type as string. 
• const isActive = true; - TypeScript infers the type as boolean.

Type inference also works with function return values:

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

What is Contextual Typing?

Contextual typing occurs when TypeScript assigns a type to a variable based on its surrounding context.

For example, when using an event listener, TypeScript infers the type of the event parameter:

document.addEventListener('click', (event) => {
  console.log(event.clientX); // TypeScript knows event is a MouseEvent
});

document.addEventListener('click', (event) => {
  console.log(event.clientX);
});

Benefits of Contextual Typing

Contextual typing improves the developer experience by reducing the need for manual type annotations.

It helps catch errors and ensures that you are working with the correct types in specific contexts.

Common Scenarios for Type Inference

TypeScript performs inference in many situations, such as:

• Variable initialization: let name = 'John';
• Function return values: function greet() { return 'Hello'; }
• Array values: let numbers = [1, 2, 3]; (inferred as number[]).

When to Use Explicit Types

While TypeScript's type inference is powerful, there are cases where explicit types are better:

• When the type is ambiguous or complex.
• For function parameters to ensure clarity.
• For public APIs where explicit types improve readability and maintainability.

Practice: Type Inference and Contextual Typing

Write a function that takes two numbers as input and returns their sum. TypeScript will infer the types for you!

Example:

function addNumbers(a, b) {
  return a + b;
}

function addNumbers(a, b) {
  return a + b;
}

Great Work!

You’ve learned how TypeScript uses type inference and contextual typing to make your code efficient and type-safe. Keep exploring TypeScript’s powerful features to enhance your coding skills!