Interfaces
Interfaces in TypeScript define a contract that specifies the structure of an object. They are used to define custom types and enforce consistency and structure in your code.
To assign types to objects, such as a user object, you can use interfaces.
Example Interface:
interface User {
firstName: string;
lastName: string;
email: string;
age: number;
}
Example User Object:
const user: User = {
firstName: "harkirat",
lastName: "singh",
email: "[email protected]",
age: 21,
};
Assignment #1 - isLegal Function
Create a function isLegal
that returns true
or false
if a user is above 18. It takes a user as an input.
Solution:
function isLegal(user: User): boolean {
return user.age >= 18;
}
Assignment #2 - TodoList React Component
Create a React component that takes todos
as an input and renders them.
Solution:
import React from "react";
interface Todo {
id: number;
text: string;
completed: boolean;
}
interface TodoListProps {
todos: Todo[];
}
const TodoList: React.FC<TodoListProps> = ({ todos }) => {
return (
<ul>
{todos.map(todo => (
<li key={todo.id}>{todo.text}</li>
))}
</ul>
);
};
export default TodoList;
2. Implementing Interfaces
Interfaces in TypeScript can also be implemented by classes. This allows you to define a blueprint for objects with specific properties and methods.
Example Interface:
interface Person {
name: string;
age: number;
greet(phrase: string): void;
}
Example Class Implementing the Interface:
class Employee implements Person {
name: string;
age: number;
constructor(n: string, a: number) {
this.name = n;
this.age = a;
}
greet(phrase: string) {
console.log(`${phrase} ${this.name}`);
}
}
Implementing interfaces in classes provides structure and consistency, allowing you to create multiple variants of objects while ensuring they adhere to a common set of rules defined by the interface.
Summary
Interfaces are used to define the structure of objects and enforce consistency.
You can use interfaces to define custom types and assign them to objects.
Interfaces can also be implemented by classes, providing a blueprint for objects with specific properties and methods.
By using interfaces, you can improve the maintainability and readability of your code by clearly defining the shape of your data and the behavior of your objects.
Last updated
Was this helpful?