All about Interfaces using OOP in Typescript
Tags: typescript, programming, beginners, tutorial
Published: 2022-03-05 01:33:28

## Hi, Devs!

**When we are talking about OOP** (Oriented Object Programming) one interesting and necessary topic is Interfaces. When to use? That's a design decision. How to manipulate? So, let's observe some cases and uses in Typescript language.

**All the things declared in Interface has a public visibility** and will be implemented into a class.

First of all, one example of its simple use:

```
interface IPerson {
   id: number,
   name: string,
   age: number
}
```

Perhaps, in some cases we can use **Generics** for typing a specific atribute in the implemented class:

```
interface IPerson<T> {
   id: T,
   name: string,
   age: number
}
```

One interface can **extends** other:

```
interface IPerson<T> {
   id: T,
   name: string,
   age: number
}
 
interface IUser extends IPerson<number> {
  password: string
}
```

We can use an Interface to **typing an object:**

```
interface IProduct {
   id: number,
   description: string,
}
 
let product: IProduct = {
  id: 1,
  description: "That's a computer"
}
```

Some attributes you can leave it **optionally using "?"** before ":", like this (age?:) below.

```
interface IPerson<T> {
   id: T,
   name: string,
   age?: number
}
```

It means that the Class will not require it in a mandatory way. We can take methods too:

```
interface IPerson<T> {
   id: T,
   name: string,
   age: number,
   getId(): T
}
```

And let's implements the above example:

```
interface IPerson<T> {
   id: T,
   name: string,
   age: number,
   getId(): T
}

class Person implements IPerson<number> {
    id: number;
    name: string;
    age: number;

    constructor(){
        this.id = 0
        this.name = ""
        this.age = 0
    }

    getId(): number {
        return this.id
    }
}
```

If you need to do **private** our **protected** attributes, you need to adjust your syntax code, because the default visibility in interface is public. So, it's necessary to write the "_" before the attribute:

```
class Person implements Person<number> {
    private _id: number;
    private _name: string;
    private _age: number;

    constructor(){
        this._id = 0
        this._name = ""
        this._age = 0
    }

    set id(id: number){
        this._id = id
    }

    set name(name: string){
        this._name = name
    }

    set age(age: number){
        this._age = age
    }

    getId(): number {
        return this._id
    }
}
```

If you don't implement the _set methods_ you get the error: 

> Class 'Person' incorrectly implements interface 'Person<number>'. Type 'Person' is missing the following properties from type 'Person<number>': id, name, age

**One Class can implement multiple interfaces:**

```
interface IPerson<T> {
   id: T,
   name: string,
   age: number,
   getId(): T
}

interface IUser {
    username: string,
    password: string
}

class Person implements IPerson<number>, IUser{
    id: number;
    name: string;
    age: number;
    username: string;
    password: string;

    constructor(){
        this.id = 0
        this.name = ""
        this.age = 0
        this.username = ""
        this.password = ""
    }

    getId(): number {
        return this.id
    }

}
```

**A abstract class can implement multiple interfaces:**

```
interface IPerson<T> {
   id: T,
   name: string,
   age: number,
   getId(): T
}

interface IUser {
    username: string,
    password: string
}

abstract class Person implements IPerson<number>, IUser{
    id: number;
    name: string;
    age: number;
    username: string;
    password: string;

    constructor(){
        this.id = 0
        this.name = ""
        this.age = 0
        this.username = ""
        this.password = ""
    }

    getId(): number {
        return this.id
    }

    abstract generatePassword():string

}

class User extends Person {
    generatePassword(): string {
        return Math.random().toFixed + "!@#$%¨&*()"
    }

}
```
**For Type or Interface discussion see here:**
https://dev.to/luizcalaca/how-to-use-in-typescript-type-or-interface-47jk


So, That's all folks!


**Contacts**
Email: luizcalaca@gmail.com
Instagram: https://www.instagram.com/luizcalaca
Linkedin: https://www.linkedin.com/in/luizcalaca/
Twitter: https://twitter.com/luizcalaca