Why interfaces are needed in Typescript - See It in Action

Why interfaces are needed

📖 Scenario: Imagine you are building a simple app to manage a list of people and their contact details. You want to make sure every person has a name and an email address. Using interfaces helps you keep your data organized and consistent.

🎯 Goal: You will create an interface to define the shape of a person object, then create a list of people using that interface. This will show why interfaces are useful to keep your data structured and avoid mistakes.

📋 What You'll Learn

Create an interface called Person with properties name (string) and email (string)

Create an array called people that holds objects following the Person interface

Add two person objects to the people array with exact names and emails

Use a for loop to print each person's name and email

💡 Why This Matters

🌍 Real World

Interfaces are used in real apps to make sure data like user profiles, products, or messages always have the right information.

💼 Career

Knowing interfaces is important for writing clear, error-free TypeScript code in professional software development.

1

Create the Person interface

Write an interface called Person with two properties: name of type string and email of type string.

Typescript

// Your code here

Need a hint?

An interface is like a blueprint for objects. Use the interface keyword followed by the name and curly braces.

2

Create the people array using the Person interface

Create a variable called people that is an array of Person objects. Initialize it as an empty array.

Typescript

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

// Your code here

Need a hint?

Use const people: Person[] = []; to create an empty array of Person objects.

3

Add two person objects to the people array

Add two objects to the people array with these exact values: { name: "Alice", email: "[e-mail]" } and { name: "Bob", email: "[e-mail]" }.

Typescript

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

const people: Person[] = [];

// Your code here

Need a hint?

Put the two objects inside the array using square brackets and commas.

4

Print each person's name and email

Use a for loop with variables person to go through people. Inside the loop, print the person's name and email using console.log with this format: Name: Alice, Email: [e-mail].

Typescript

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

const people: Person[] = [
  { name: "Alice", email: "[e-mail]" },
  { name: "Bob", email: "[e-mail]" }
];

// Your code here

Need a hint?

Use for (const person of people) and inside the loop use console.log with a template string.