JavaScript map returning undefined for some elements [duplicate]

Question

Given the following array of member data, I'm to return an array of memberID's for members whose membership status not current.

Here's the member data:

var members = [
  {
    firstName: 'Howard',
    lastName: 'Lee',
    membershipIsCurrent: true,
    MemberID: 235
  },
  {
    firstName: 'James',
    lastName: 'Icharis',
    membershipIsCurrent: false,
    MemberID: 236
  },
  {
    firstName: 'Thomas',
    lastName: 'Cronquist',
    membershipIsCurrent: true,
    MemberID: 237
  },
  {
    firstName: 'Philip',
    lastName: 'Grover',
    membershipIsCurrent: false,
    MemberID: 238
  },
  {
    firstName: 'Eric',
    lastName: 'Broadstone',
    membershipIsCurrent: true,
    MemberID: 239
  },
  {
    firstName: 'Hunter',
    lastName: 'Gonzales',
    membershipIsCurrent: true,
    MemberID: 240
  }];

Here is my code to grab that data:

function lapsedIDs (array ) {
  return array.map( function ( member ) {
    if ( member.membershipIsCurrent === false ) {
      return member.MemberID;
    }
  });
}

lapsedIDs(members);

Here is the result. I don't understand why it's returning undefined for each member whose membership has NOT lapsed. Any pointers??

[ undefined, 236, undefined, 238, undefined, undefined ]

Melano

Answer 1

map() will create a new element for every existing one in the original array.

If you don't return something for all conditions a function automatically returns undefined which is what you are seeing

You could filter() first to remove the unwanted items and then map()

 return array.map( function ( member ) {
    return member.membershipIsCurrent
  }).map(function(member){
     return member.MemberID;
  });

Gillard

Answer 2

Why this problem :- because .map every time should return a value in your case if the condition is false the function return undefined because you don't provide any value to return . What to do ? use filter first then use map look at the solution below

var members = [
  {
    firstName: 'Howard',
    lastName: 'Lee',
    membershipIsCurrent: true,
    MemberID: 235
  },
  {
    firstName: 'James',
    lastName: 'Icharis',
    membershipIsCurrent: false,
    MemberID: 236
  },
  {
    firstName: 'Thomas',
    lastName: 'Cronquist',
    membershipIsCurrent: true,
    MemberID: 237
  },
  {
    firstName: 'Philip',
    lastName: 'Grover',
    membershipIsCurrent: false,
    MemberID: 238
  },
  {
    firstName: 'Eric',
    lastName: 'Broadstone',
    membershipIsCurrent: true,
    MemberID: 239
  },
  {
    firstName: 'Hunter',
    lastName: 'Gonzales',
    membershipIsCurrent: true,
    MemberID: 240
  }];
function lapsedIDs (array ) {
  return array.filter( function ( member ) {
    return member.membershipIsCurrent === false 
      
  }).map(function(member){
      return member.MemberID;
});
}


console.log(lapsedIDs(members));

Fourpenny

Answer 3

Array.map() runs on every element in the source array, and maps it to something else. You aren't returning the member ID from the current members, so it maps them to undefined. You probably just want to modify your function to start with let lapsedMembers = []; and then use forEach instead of map, and in that loop just push the IDs to the lapsedMembers array.

var members = [
  {
    firstName: 'Howard',
    lastName: 'Lee',
    membershipIsCurrent: true,
    MemberID: 235
  },
  {
    firstName: 'James',
    lastName: 'Icharis',
    membershipIsCurrent: false,
    MemberID: 236
  },
  {
    firstName: 'Thomas',
    lastName: 'Cronquist',
    membershipIsCurrent: true,
    MemberID: 237
  },
  {
    firstName: 'Philip',
    lastName: 'Grover',
    membershipIsCurrent: false,
    MemberID: 238
  },
  {
    firstName: 'Eric',
    lastName: 'Broadstone',
    membershipIsCurrent: true,
    MemberID: 239
  },
  {
    firstName: 'Hunter',
    lastName: 'Gonzales',
    membershipIsCurrent: true,
    MemberID: 240
  }];
  
function lapsedIDs ( array ) {
  let lapsedMembers = [];
  
  array.forEach(function ( member ) {
    if ( member.membershipIsCurrent === false ) {
      lapsedMembers.push(member.MemberID);
    }
  });
  
  return lapsedMembers;
}

console.log(lapsedIDs(members));

Arias

Answer 4

That map wants to put something in the array even if your membershipIsCurrent test fails. So it throws in an undefined.

You might filter before your map to avoid this.

function lapsedIDs(array) {
    return array.filter(member => {
        return !member.membershipIsCurrent;
    }).map(member => member.MemberID);
}

lapsedIDs(members);

Blackmarketeer

Answer 5

I was attempting to fix the same problem and realized after looking at this post that the simplest solution is

function lapsedIDs (array ) {
    return array.map( function ( member ) {
      if ( member.membershipIsCurrent === false ) {
        return member.MemberID;
      }
    }).filter(y => y !== undefined);
}

In my case I don't know what the input is and I don't care, I just want the map to return all the defined values.

Unpredictable