Create a Controlled Input works, but why?

My solution works, I’m wondering why though.
on the handleChange function, where is the ‘event’ argument coming from exactly? How is this working?
SPOILER SOLUTION AHEAD
Thanks!


class ControlledInput extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      input: ''
    };
    // change code below this line
    this.handleChange = this.handleChange.bind(this);
    // change code above this line
  }
  // change code below this line
  handleChange(event) {
    this.setState({
      input: event.target.value
    });
  }
  // change code above this line
  render() {
    return (
      <div>
        { /* change code below this line */}
        <input value={this.state.input} onChange={this.handleChange}/>
        { /* change code above this line */}
        <h4>Controlled Input:</h4>
        <p>{this.state.input}</p>
      </div>
    );
  }
};

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36.

Link to the challenge:

Your full working solution has been blurred. We prefer you not to post full working solutions to avoid spoilers for other campers who happen to come across your thread using the forum search. In the future, just post a particular section of code you do not understand.

Answer to your question: The event object is automatically passed to the onClick method in JavaScript.