DEV Community

Dharan Ganesan
Dharan Ganesan

Posted on

Day 36: Typescript Basics

Type Annotations 📝

Type annotations to define explicit declarations of the data type for a variable, function parameter, or return value. By using type annotations, developers can ensure type safety and catch potential errors during development rather than at runtime.

let age: number;
age = 25; // This is valid
age = "25"; // This will throw a compilation error
Enter fullscreen mode Exit fullscreen mode

Type annotations shine when you need precise control over types and want to communicate that intention to other developers.

Type Inference 🕵️‍♂️

TypeScript's type inference is ability to automatically conclude the type of a value based on its usage and context. This feature eliminates the need for explicit type annotations in many cases, making code more concise and readable.

let username = "John Doe"; // TypeScript infers the type as string
Enter fullscreen mode Exit fullscreen mode

Type inference shines in scenarios where the type is evident from the assignment, reducing redundancy and potential human errors 🧩.

The type 🛠️

The type keyword allows developers to create custom types by combining existing types. This is especially useful when dealing with complex data structures or union types.

type Point = {
  x: number;
  y: number;
};

function calculateDistance(point: Point) {
  // ...
}
Enter fullscreen mode Exit fullscreen mode

The type keyword supports union types, intersections, and conditional types, enabling the creation of advanced type compositions.

The interface 📜

The interface keyword is used to define contracts that describe the shape of objects. Interfaces can be implemented by classes and can also extend other interfaces.

interface User {
  id: number;
  username: string;
}

class Admin implements User {
  // ...
}
Enter fullscreen mode Exit fullscreen mode

Interfaces are particularly effective when defining object structures, as they provide a clear contract for expected properties and methods.

type vs interface

The choice between type and interface often sparks debates among TypeScript developers. While both can achieve similar outcomes, there are some nuanced differences to consider 🤔.

  • Extending:

    • Interfaces can extend other interfaces using the extends keyword, allowing for incremental building of complex structures.
    • Types can be combined using intersections (&) to achieve similar results.
  • Declaration Merging:

    • Interfaces support declaration merging, where multiple interface declarations with the same name are automatically merged into one.
    • Types do not support declaration merging.
  • Compatibility with Primitives:

    • Interfaces can't be directly used to describe primitive types like string, number, etc.
    • Types can easily represent primitive types.

Ultimately, the choice between type and interface depends on the specific use case and coding style preferences. It's recommended to use interface when defining contracts and object structures, and type when dealing with more complex and composed types.

Top comments (0)