How to exclude key in object with map

Question

I have an object

{
   id: 10, 
   email: "[email protected]", 
   roles: Array(1), 
   firstName: "toto", 
   lastName: "tata"
}

I would like to display only [email protected], toto, tata and exclude id and role

So I did this but I don't know how to exclude id and role. I tried with filter but it's not working.. Does anyone know how to do that?

const datas = Object.entries(data).map(([key, value]) => {
   return (
      <div key={key.id}>
         <p>
            {value}
         </p>
      </div>
   );
});

filter should just work as intended. How is it not working? — briosheje
– briosheje, Commented Jul 22, 2020 at 11:50
Does this answer your question? Filter object properties by key in ES6 — Eggcellentos
– Eggcellentos, Commented Jul 22, 2020 at 11:56

Emre Koc · Accepted Answer · 2020-07-22 12:02:56Z

3

Use filter to filter out the ones you dont want:

const datas = Object.entries(data)
  .filter(([key]) => key !== 'id' && key !== 'role')
  .map(([key, value]) => {
    return (
      <div key={key.id}>
        <p>
          {value}
        </p>
      </div>
    );
  });

edited Jul 22, 2020 at 12:02

answered Jul 22, 2020 at 11:50

Emre Koc

1,58811 silver badges22 bronze badges

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

3 Comments

Jax-p Over a year ago

With a little shorter syntax .filter(key => !['id','role'].includes(key))

askemeline Over a year ago

Thanks for your answer but it still displays id and role :/

Emre Koc Over a year ago

Corrected the filter; should have used ([key]) to get the key.

Deykun · Accepted Answer · 2020-07-22 12:04:09Z

2

It is a good place to use Array.filter, but if you know which fields you want to show and there are only three you can do it like this:

  const { email, firstName, lastName } = data;

  return (
    <div>
      <p>
        {email}
      </p>
    </div>
    <div>
      <p>
        {firstName}
      </p>
    </div>
    <div>
      <p>
        {lastName}
      </p>
    </div>
   );

The key is not needed. Also I'm not sure if key.id is a valid parameter here, I think that we are receiving a string, not an object from the Object.entries array.

The approach I showed is more descriptive, does not use a loop and it is easier to add <a> for an email or put full name (first and last name) in one <h1> HTML tag.

edited Jul 22, 2020 at 12:04

answered Jul 22, 2020 at 11:57

Deykun

1,26011 silver badges14 bronze badges

Collectives™ on Stack Overflow

How to exclude key in object with map

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related