How to destructure array of objects?

Question

Given this JSON object:

{
    "Person": {
        "UID": 78,
        "Name": "Brampage",
        "Surname": "Foo"
    },
    "Notes": [
        {
            "UID": 78,
            "DateTime": "2017-03-15T15:43:04.4072317",
            "Person": {
                "Name": "Brampage",
                "Surname": "Foo"
            },
            **"Note":** {
                "Title": "Lorem Ipsum...",
                "Content": "Blaat blaat blaat blaat ..."
            }
        },
        {
            "UID": 78,
            "DateTime": "2017-03-15T15:43:04.4072317",
            "Person": {
                "Name": "Brampage",
                "Surname": "Foo"
            },
            "Note": {
                "Title": "Lorem Ipsum...",
                "Content": "Blaat blaat blaat blaat ..."
            }
        }
        // etc.
    ]
}

How should I destructure this object so that I will be left over with this data: Person, Notes.Note[].

This is what I have tried to accomplish the above, however it does not work:

this.http.get(url)
.map(res => {
    const jsonObject = res.json();

    // Destructuring
    const { Person} = jsonObject;
    const [{ Note }] = jsonObject.Notes;

    return {
        person: Person,
        note:[
            Note
        ]
    }
})
.subscribe(
    usefullInformation => {
        console.log(usefullInformation);
    },
    error => {
    }
);

This is TypeScript's documentation on how to destructure: TypeScript Destructuring Documenation

Can’t do that with destructuring. Just use regular dot access and `map`. — Ry-, Mar 17 '17 at 08:53

score 1 · Accepted Answer · answered Mar 17 '17 at 09:58

As Ryan said, you need to serialize your data by hand. Because destructuring does not handle conditional statements. I would suggest you write a serializer function that is called by Observable.map on the data.

For example:

const data = {
    "Person": {
        "UID": 78,
        "Name": "Brampage",
        "Surname": "Foo"
    },
    "Notes": [
        {
            "UID": 78,
            "DateTime": "2017-03-15T15:43:04.4072317",
            "Person": {
                "Name": "Brampage",
                "Surname": "Foo"
            },
            "Note": {
                "Title": "Lorem Ipsum...",
                "Content": "Blaat blaat blaat blaat ..."
            }
        },
        {
            "UID": 78,
            "DateTime": "2017-03-15T15:43:04.4072317",
            "Person": {
                "Name": "Brampage",
                "Surname": "Foo"
            },
            "Note": {
                "Title": "Lorem Ipsum...",
                "Content": "Blaat blaat blaat blaat ..."
            }
        }
    ]
}

function getNotesFor(uid, notes) {
  return notes
    .filter(item => item.UID === uid)
    .map(item => item.Note);
}

const { Person } = data;
const Notes = getNotesFor(Person.UID, data.Notes);

console.log(Person, Notes);

Since it is not possible with destructuring I accept this answer, thanks for the clear solution, I thought I probably overlooked something. — Brampage, Mar 17 '17 at 10:01

How to destructure array of objects?

1 Answers1