Methods
Square(props) → {HTMLButtonElement}
A function component.
In React, function components are a simpler way to write components that only contain a render method and don’t have their own state.
Since the Square components no longer maintain state, the Square components receive values from the Board component and inform the Board component when they’re clicked. In React terms, the Square components are now controlled components. The Board has full control over them.Parameters:
Name | Type | Description | |||||||||
---|---|---|---|---|---|---|---|---|---|---|---|
props |
Object | React Props.
Properties
|
- Source:
- See:
Returns:
a <button> tag with the given props.
- Type
- HTMLButtonElement
calculateWinner(squares) → {String}
Given an array of 9 squares, this function will check
for a winner and return 'X', 'O', or null as appropriate.
Parameters:
Name | Type | Description |
---|---|---|
squares |
Array.<String> | a given array of 9 squares. |
- Source:
Returns:
the winner: "X", "O", or null if there is not a winner.
- Type
- String
Type Definitions
state_setter()
Add the new configuration (another square array) to history.
History: Array (5) = $2 0 {squares: Array} squares: [null, null, null, null, null, null, null, null, null] (9) 1 {squares: Array} squares: ["X", null, null, null, null, null, null, null, null] (9) 2 {squares: Array} squares: ["X", null, null, null, null, null, null, null, "O"] (9) 3 {squares: Array} squares: ["X", null, null, null, "X", null, null, null, "O"] (9) 4 {squares: Array} squares: ["X", null, "O", null, "X", null, null, null, "O"] (9)When you call setState in a component, React automatically updates the child components inside of it too.