FCC´s Drum Machine example: doubt about map

JavaScript
1

I finished the project, but I was checking out the example´s code to see if I could learn something. I understand almost all of it, but came to a doubt when looking at this:

class PadBank extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    let padBank;
    this.props.power ?
      padBank = this.props.currentPadBank.map((drumObj, i, padBankArr) => {
        return (
          <DrumPad 
						clipId={padBankArr[i].id} 
						clip={padBankArr[i].url}
						keyTrigger={padBankArr[i].keyTrigger}
						keyCode={padBankArr[i].keyCode} 
						updateDisplay={this.props.updateDisplay} 
						power={this.props.power} />
        )
      }) :
      padBank = this.props.currentPadBank.map((drumObj, i, 
                                              
                                              
                                             ) => {
        return (
          <DrumPad 
						clipId={padBankArr[i].id} 
						clip="#"
						keyTrigger={padBankArr[i].keyTrigger}
						keyCode={padBankArr[i].keyCode} 
						updateDisplay={this.props.updateDisplay} 
						power={this.props.power} />
        )
      });
    return (
      <div className="pad-bank" >
				{padBank}
			</div>
    )
  }
}

How does this work exactly? I don´t see drumObj nor padBankArr defined anywhere. How does the function get pointed to the right variables?

2

Nevermind, I figured it out: the map function will always take the third argument as the array it´s working on, regardless of what you call it.