How do I convert array of objects to object in javascript?

Question

I have an array of objects:

let userDetail = [{id: "12347442", name: "ZarNi" , age: 23}
{id: "2435457", name: "Michael" , age: 13},
{id: "8639503", name: "John" , age: 18}
]

I filtered this array into this:

let filteredUser = userDetail.filter(user => user.id === "12347442");

I need to put object to react state. so I've written like this:

this.setState({user: {...filteredUser}});

When I took the console for user state,I've got the result like this:

console.log(this.state.user);

Result => {0:{id: "12347442", name: "ZarNi" , age: 23}} as a result;

I don't want Key 0. I just want to get object like this

{id: "12347442", name: "ZarNi" , age: 23}

userDetail[0] not working?

Derek Wang
– Derek Wang

2020-10-11 08:30:38 +00:00
Commented Oct 11, 2020 at 8:30 — Derek Wang
– Derek Wang, Commented Oct 11, 2020 at 8:30
why not take the object with an index?

Nina Scholz
– Nina Scholz

2020-10-11 08:30:41 +00:00
Commented Oct 11, 2020 at 8:30 — Nina Scholz
– Nina Scholz, Commented Oct 11, 2020 at 8:30
const [obj] = yourArray;

zb22
– zb22

2020-10-11 08:31:13 +00:00
Commented Oct 11, 2020 at 8:31 — zb22
– zb22, Commented Oct 11, 2020 at 8:31
this.setState({user: {...filteredUser[0]}});

Jaromanda X
– Jaromanda X

2020-10-11 08:58:09 +00:00
Commented Oct 11, 2020 at 8:58 — Jaromanda X
– Jaromanda X, Commented Oct 11, 2020 at 8:58

raina77ow · Accepted Answer · 2020-10-11 08:59:32Z

2

If all the records in your array have different IDs OR you expect to use the first match anyway, it's not filter you need - but find:

// const, as you're not expected to change value of that variable
const foundUser = userDetail.find(user => user.id === "12347442");

In this case you won't even have to worry about extracting the first element from that array which is result of filter op - and pass that user into setState directly.

edited Oct 11, 2020 at 8:59

answered Oct 11, 2020 at 8:46

raina77ow

107k16 gold badges205 silver badges240 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

A.R.SEIF · Accepted Answer · 2020-10-11 08:47:12Z

1

you can use find

let userSelected = userDetail.find(x=>x.id === '12347442');

answered Oct 11, 2020 at 8:47

A.R.SEIF

8731 gold badge8 silver badges28 bronze badges

Comments

Robert Christopher · Accepted Answer · 2020-10-12 04:11:37Z

1

I changed my code like this and I've got the result that I want.

    let userDetail = [{id: "12347442", name: "ZarNi" , age: 23},
                      {id: "2435457", name: "Michael" , age: 13},
                      {id: "8639503", name: "John" , age: 18}];

    let user = userDetail.find(user => user.id === "12347442");
 
    this.setstate({user: user});
    console.log(this.state.user);

Result:

{id: "12347442", name: "ZarNi" , age: 23}

edited Oct 12, 2020 at 4:11

Robert Christopher

5,4901 gold badge22 silver badges25 bronze badges

answered Oct 11, 2020 at 8:53

ZarNiHein

731 silver badge6 bronze badges

2 Comments

raina77ow Over a year ago

No offence, but this tremendously inefficient - and what's more important, not really readable. Why do you use filter when find is fit? Why do you copy your found object - not once, but twice? Do you know that with ... you'll have only a shallow copy of an object? And why do you post your own code as an answer when it's essentially the same of one of existing ones?

ZarNiHein Over a year ago

These codes are both different a bit and not sufficient yet. Anyway, thanks man. I accept your suggestion. I am gotta change filter to find method.

Mehrzad Tejareh · Accepted Answer · 2020-10-11 08:32:07Z

0

if your array length=1 you must get userDetail[0]

answered Oct 11, 2020 at 8:32

Mehrzad Tejareh

6335 silver badges21 bronze badges

1 Comment

ZarNiHein Over a year ago

got it. Thanks for your help.

Collectives™ on Stack Overflow

How do I convert array of objects to object in javascript?

4 Answers 4

Comments

Comments

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related