CODEWITHSUNDEEP
javascriptfilter
lost9123193
lost9123193

Reputation: 11030

How to map with a conditional in Javascript

I'm traversing through an object array:

people = [
  {id:1, name:"Bob", available:false},
  {id:2, name:"Sally", available:true},
  {id:1, name:"Trish", available:false},
]

I want my output to be the names of those available:

["Sally"]

I currently know how to map and extract for a field. How do I add the conditional?

  const peopleAvailable = people.map(person => person.value);

Want to do something like this:

  const peopleAvailable = people.map(person.available => person.value);

Upvotes: 7

Views: 19876

Answers (3)

Kamil Kiełczewski
Kamil Kiełczewski

Reputation: 92367

Try

people.reduce((a,c) => a.concat(c.available ? c.name:[]), [])


people = [
  {id:1, name:"Bob", available:false},
  {id:2, name:"Sally", available:true},
  {id:1, name:"Trish", available:false},
];

let r = people.reduce((a,c) => a.concat(c.available ? c.name:[]), [])

console.log(r);

Upvotes: 1

Neel Rathod
Neel Rathod

Reputation: 2111

You can't check the condition in map(). If you put conditions then other elements will be returns as undefined. You can deal with this by applying filter() which allows you to return only those elements which are falls in your condition. So you need to use filter() then use map() on the filtered result.

const array = [{
    id: 1,
    name: "Bob",
    available: false
  },
  {
    id: 2,
    name: "Sally",
    available: true
  },
  {
    id: 1,
    name: "Trish",
    available: false
  },
];

const withFilter = array
.filter((r) => { return r.available; })
.map((m) => { return m.name; });                

console.log(withFilter);

const withOutFilter = array
.map((m) => { if(m.available) { return m.name; } });                

console.log(withOutFilter);

Upvotes: 0

Dacre Denny
Dacre Denny

Reputation: 30360

You cannot conditionally map with the .map() function alone, however you can use .filter() to achieve what you require.

Calling filter will return a new array where each item in the new array satisfies your filtering criteria (ie people.available === true).

In the case of your code, you can directly chain filter with your existing call to .map() to obtain the desired result:

const people = [{
    id: 1,
    name: "Bob",
    available: false
  },
  {
    id: 2,
    name: "Sally",
    available: true
  },
  {
    id: 1,
    name: "Trish",
    available: false
  },
];

const peopleAvailable = people
.filter(people => people.available)    /* filter available people */
.map(person => person.name)            /* map each person to name */ 

console.log(peopleAvailable);

Upvotes: 13

Related Questions