Still new to the JavaScript world, so bear with me...

I'm receiving an object from the server that, for the sake of argument, looks as follows:

{
    "names": [
        { "id": 99, "firstName": "John" },
        { "id": 13, "firstName": "Andreas" }
    ],
    "people": [
        { "id": 17, "nameId": 99, "age": 55 },
        { "id": 15, "nameId": 13, "age": 16 }
    ]
}

I currently have a bunch of utility methods that look like

function getPerson(serverObject, personId) {
    return serverObject.people.find(({id}) => id === personId)
}

function getName(serverObject, nameId) {
    return serverObject.names.find(({id}) => id === nameId)
}

function getFirstNameOfPerson(serverObject, personId) {
    var person = getPerson(serverObject, personId)
    return getName(serverObject, person.nameId).firstName
}

Instead of

getFirstNameOfPerson(serverObject, getPerson(serverObject, 17))

I would like to work with the serverObject as follows:

serverObject.getPerson(17).getFirstName()

So I'm thinking of either attaching a bunch of methods onto the server object when I receive it from the server, or create a separate ServerObjectAccessor class which wrapps the server object and has a bunch of access methods.

Is this a common practice? Is there a better way of doing it? Should I be using prototypes for this type of thing? I'm using Redux. Would it be appropriate to do the wrapping in the reducer and store only the ServerObjectAccessor in the state?

(I'm actually using TypeScript if it matters...)