Typescript type definition of a mapped Object already define

Question

I am working on a project using Typescript. The code works fine. I am just wondering what would be the best practice for the type definition of a mapped Object that has been filtered and aslo defined already. For instance, if I have the following code:

const person: Person = {
    name: 'Joe',
    surname: 'Doe',
    age: 30,
    address: [{
        mainAddress: {
            street: "Queen st",
            number: 9,
            building: 'main',
            unit: 5,
        },
        secundaryAddress: {
            street: "King st",
            number: 7,
            house: 'The house'
        }
    }]
}

interface Person {
    name: string
    surname: string
    age: number
    address: [{
        mainAddress: {
            street: string
            number:number
            building: string
            unit: number
        }},
        {
        secundaryAddress: {
            street: string
            number: number
            house: string
        }
    }]
}
const filterPerson = person.address.filter((ad: any) => ad.mainAddress ? true : false)

const mappedAddress = filterPerson.map((m: any) => m.)

After I do the filter on the main Object. I need to map the result. In this case the filterPerson.map works fine with any as a type definition, but is there a best way to define ad in the filter and m in the map or should I write a new interface for both in this case.

The error that pops up if I delete any on the filter and I hover on mainAddress of the example is this [![enter image description here][1]][1]

As you can see the Object in my code is different but the syntax on the example here is the same. [1]: https://i.stack.imgur.com/hfaro.png

Answer 1

You give us the below object which has address as an object

const person: Person = {
    name: 'Joe',
    surname: 'Doe',
    age: 30,
    address: {
        mainAdress: {
            street: "Queen st",
            number: 9,
            building: 'main',
            unit: 5,
        },
        secundaryAdress: {
            street: "King st",
            number: 7,
            house: 'The house'
        }
    }
}

But then give us this as the interface which has address as an array of objects.

interface Person {
    name: string
    surname: string
    age: number
    address: [{
        mainAdress: {
            street: string
            number:number
            building: string
            unit: number
        }},
        {
        secundaryAdress: {
            street: string
            number: number
            house: string
        }
    }]
}

And then you give us an incomplete filter method:

const mappedAddress = filterPerson.map((m: any) => m.)

Please fix your examples

EDIT: Assuming that address is actually defined like the below I would create 4 interfaces, one for the main Person, 1 for the Address and one for each type of Adress

    address: [{
        mainAdress: {
            street: "Queen st",
            number: 9,
            building: 'main',
            unit: 5,
        },
        secondaryAdress: {
            street: "King st",
            number: 7,
            house: 'The house'
        }
    }]

interface MainAdress {
   street: string;
   number: number;
   building: string;
   unit: number;
}

interface SecondaryAdress {
    street: string;
    number: number;
    house: string;
}

interface Address {
    mainAdress?: MainAdress;
    secondaryAdress?: SecondaryAdress;
}

interface Person {
    name: string
    surname: string
    age: number
    address: Address[];
}

And then your filterPerson const can be typed as follows:

const filterPerson: Address[] = person.address.filter((ad: (Address)) => ad.mainAdress ? true : false)