Basic mapped type syntax in Typescript - Mini Project: Build & Apply

Basic mapped type syntax

📖 Scenario: You are working on a TypeScript project where you want to create a new type that changes all properties of an existing type to be optional.

🎯 Goal: Learn how to use basic mapped type syntax in TypeScript to create a new type with all properties optional.

📋 What You'll Learn

Create an interface called Person with exact properties

Create a mapped type called OptionalPerson that makes all Person properties optional

Use the mapped type syntax with keyof and in

Print the type of OptionalPerson to verify

💡 Why This Matters

🌍 Real World

Mapped types help you transform existing types easily, useful in large projects to create flexible data shapes.

💼 Career

Understanding mapped types is important for TypeScript developers to write clean, reusable, and type-safe code.

1

Create the Person interface

Create an interface called Person with these exact properties: name as string, age as number, and email as string.

Typescript

// Your code here

Need a hint?

Use the interface keyword and define each property with its type.

2

Create the mapped type OptionalPerson

Create a mapped type called OptionalPerson that makes all properties of Person optional using keyof Person and in syntax with a ? modifier.

Typescript

interface Person {
  name: string;
  age: number;
  email: string;
}

// Your code here

Need a hint?

Use type OptionalPerson = { [K in keyof Person]?: Person[K] } to make all properties optional.

3

Create a variable of type OptionalPerson

Create a variable called person1 of type OptionalPerson and assign it an object with only the name property set to "Alice".

Typescript

interface Person {
  name: string;
  age: number;
  email: string;
}

type OptionalPerson = {
  [K in keyof Person]?: Person[K];
};

// Your code here

Need a hint?

Declare person1 with type OptionalPerson and assign an object with only name.

4

Print the person1 variable

Write a console.log statement to print the person1 variable.

Typescript

interface Person {
  name: string;
  age: number;
  email: string;
}

type OptionalPerson = {
  [K in keyof Person]?: Person[K];
};

const person1: OptionalPerson = {
  name: "Alice"
};

// Your code here

Need a hint?

Use console.log(person1) to print the object.