'A function with a single if statement returns a display, a function without multiple ifs does not

I have a function that contains a single If statement that returns values accordingly.

  const displayMovements = () => {
  return(
  movements.map((e) => {
    if (e.equipment == availableEquipment && e.movementPattern == selectedMovementPattern) {
      console.log(e.movement + " matches")
      return(
        <h6 key={e.movement}>{e.movement}</h6>
      )
    }
  })
)

}

Another function is similar, but contains multiple If statements that do not display anything, although the console.log() does display accordingly.

  const functionTwo= () => {
  return(
  movements.map((m) => {
    availableEquipment.map((e) => {
      if (m.equipment == e) {
        if (m.movementPattern == selectedMovementPattern) {
          console.log(m.movement + " matches")
          return(
            <h6 key={m.movement}>{m.movement}</h6>
          )
        }
      }
    })
  })
)
}

Both functions are being called in an identical manner.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source