In am a beginner in React. In the [Tic Tac Toe Tutorial](https://reactjs.org/tutorial/tutorial.html) on the official React website, there are 3 Components: 

1. Square
2. Board (consisting of 3x3 Square Components)
3. Game (parent of Board)

The idea is that whenever a square Component is clicked the clicked event will pass up to the Board and further up to the Game Component. The Game Component will handle this onClick event.

```
 <Board onClick={i => this.handleClick(i)}/>

```

`handleClick(i)` is a function inside Board Component.

**Board Component**

```
<Square onClick={() => this.props.onClick(i)}/>

```

**Square Component**

```
<button className="square" onClick={props.onClick}></button>

```

The above code snippet is from index.js at: [CodePen](https://codepen.io/gaearon/pen/gWWZgR?editors=0010) 

What I could not understand is what does:

```
 <Board onClick={i => this.handleClick(i)}/>

```

mean?

What does `i` mean here ? Where does it come from ? If we remove `i` then why does not the function work ?