From array of objects extract array of property values for items having another property equal to given value

Question

An array is given below. I would like to get the username for every single member of this array whose team is red!

const array = [
  {
    username: "john",
    team: "red",
    score: 5,
    items: ["ball", "book", "pen"]
  },
  {
    username: "becky",
    team: "blue",
    score: 10,
    items: ["tape", "backpack", "pen"]
  },
  {
    username: "susy",
    team: "red",
    score: 55,
    items: ["ball", "eraser", "pen"]
  },
  {
    username: "tyson",
    team: "green",
    score: 1,
    items: ["book", "pen"]
  },

];

I've tried this code:

const colorTeam = array.filter(teams=>teams.team === 'red');
console.log('teamColor:', username);

It didn't work!

When you do console.log('teamColor:', username);, where is username supposed to be coming from? And why is that line not using colorTeam from the previous line? — user5734311
– user5734311, Commented Dec 14, 2020 at 11:51

Yevhen Horbunkov · Accepted Answer · 2020-12-14 16:15:53Z

2

As opposed to filter()+map() (two passes over the source array), one may use Array.prototype.reduce() to achieve that in a single pass (which may give certain performance gain should input array be large enough, or such filtering performed often enough):

const array = [{username:"john",team:"red",score:5,items:["ball","book","pen"]},{username:"becky",team:"blue",score:10,items:["tape","backpack","pen"]},{username:"susy",team:"red",score:55,items:["ball","eraser","pen"]},{username:"tyson",team:"green",score:1,items:["book","pen"]}],

      redTeamNames = array.reduce((acc, {username, team}) => 
        (team == 'red' && acc.push(username), acc), [])
        
console.log(redTeamNames)

.as-console-wrapper{min-height:100%;}

edited Dec 14, 2020 at 16:15

answered Dec 14, 2020 at 11:41

Yevhen Horbunkov

15.6k3 gold badges27 silver badges46 bronze badges

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

Comments

Alexey Victorov · Accepted Answer · 2020-12-14 11:39:47Z

0

If this is what you wanted? First we filter objects with team === red, then we map the array to contain username property only.

const array = [
  {
    username: "john",
    team: "red",
    score: 5,
    items: ["ball", "book", "pen"]
  },
  {
    username: "becky",
    team: "blue",
    score: 10,
    items: ["tape", "backpack", "pen"]
  },
  {
    username: "susy",
    team: "red",
    score: 55,
    items: ["ball", "eraser", "pen"]
  },
  {
    username: "tyson",
    team: "green",
    score: 1,
    items: ["book", "pen"]
  },

];

const colorTeam = array
  .filter(teams=>teams.team === 'red')
  .map(user=>user.username);
console.log('teamColor:', colorTeam);

answered Dec 14, 2020 at 11:39

Alexey Victorov

4332 silver badges10 bronze badges

1 Comment

Ivan Vrzogic Over a year ago

I previously used just those two lines of code:const colorTeam = array .filter(teams=>teams.team === 'red'). It shows all features of an array's members that contain team of red color! The line of code .map(user=>user.username); is key line of code! So I grabbed the logic! Thank you!

Alan Omar · Accepted Answer · 2020-12-14 11:40:37Z

0

user Array.filter followed by Array.map:

const array=[{username:"john",team:"red",score:5,items:["ball","book","pen"]},{username:"becky",team:"blue",score:10,items:["tape","backpack","pen"]},{username:"susy",team:"red",score:55,items:["ball","eraser","pen"]},{username:"tyson",team:"green",score:1,items:["book","pen"]}];

let result = array.filter(({team}) => team === "red").map(({username}) => username)

console.log(result)

answered Dec 14, 2020 at 11:40

Alan Omar

4,2871 gold badge13 silver badges26 bronze badges

Comments

waluga · Accepted Answer · 2020-12-14 12:00:29Z

0

In one line:

let newArray = array.filter((el) => el.team==="red" ? el : "").map((el) => el.username);

First, filter objects with team property named "red", then use map method to get username properties only.

edited Dec 14, 2020 at 12:00

answered Dec 14, 2020 at 11:54

waluga

1701 silver badge6 bronze badges

2 Comments

Yevhen Horbunkov Over a year ago

Using .filter() this way is a bit overkill: .filter() returns all items of the source array for which callback passed as an argument evaluates to truthy value, so simple array.filter((el) => el.team==="red") (where boolean true/false is returned) is absolutely enough, and there's no need to overburden that with ternary, returning object (evaluated truthy) or empty string (evaluated falsy).

Yevhen Horbunkov Over a year ago

And, of course, your approach is nothing different to 2 answers posted earlier, so it is not clear which extra value you attempted to bring in, so more comprehensive explanation would make sense.

Collectives™ on Stack Overflow

From array of objects extract array of property values for items having another property equal to given value

4 Answers 4

Comments

1 Comment

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related