Why type design patterns matter in Typescript - See It in Action

Why type design patterns matter

📖 Scenario: Imagine you are building a simple app that manages a list of users. Each user has a name and an age. You want to make sure your program handles user data correctly and safely.

🎯 Goal: Learn why using type design patterns in TypeScript helps keep your code safe and easy to understand by creating and using types for user data.

📋 What You'll Learn

Create a type for a user with name and age

Create a list of users using the user type

Write a function that takes a user and returns a greeting string

Print a greeting for each user

💡 Why This Matters

🌍 Real World

Type design patterns help developers build apps that handle data safely, avoiding bugs caused by wrong data types.

💼 Career

Understanding and using types is essential for TypeScript developers to write reliable and maintainable code in professional projects.

1

Create a User type

Create a type called User with two properties: name of type string and age of type number.

Typescript

// Your code here

Need a hint?

Use the type keyword to define a new type with properties and their types.

2

Create a list of users

Create a variable called users that is an array of User type. Add these exact users: { name: "Alice", age: 30 } and { name: "Bob", age: 25 }.

Typescript

type User = {
  name: string;
  age: number;
};

// Your code here

Need a hint?

Use User[] to declare an array of users and add the exact objects inside square brackets.

3

Write a greeting function

Write a function called greetUser that takes one parameter user of type User and returns a string greeting like `Hello, ${user.name}! You are ${user.age} years old.`.

Typescript

type User = {
  name: string;
  age: number;
};

const users: User[] = [
  { name: "Alice", age: 30 },
  { name: "Bob", age: 25 }
];

// Your code here

Need a hint?

Use a function with typed parameter and return a template string with user properties.

4

Print greetings for all users

Use a for loop with user to go through users and print the result of greetUser(user) for each user.

Typescript

type User = {
  name: string;
  age: number;
};

const users: User[] = [
  { name: "Alice", age: 30 },
  { name: "Bob", age: 25 }
];

function greetUser(user: User): string {
  return `Hello, ${user.name}! You are ${user.age} years old.`;
}

// Your code here

Need a hint?

Use a for...of loop and console.log to print each greeting.