Skip to content

Conversation

@qingyuanhz1
Copy link

No description provided.

Copy link

@kaidamasaki kaidamasaki left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Well done!

I left a couple of little style comments but overall things looked great! 😃

Comment on lines +34 to +35
const row = Math.floor(squareToUpdate.id/3)
const colume = squareToUpdate.id%3

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is a really smart way to find the indexes!

if (squareToUpdate.value === '') {
squareToUpdate.value = currentPlayer
newBoard[row][colume] = squareToUpdate
if (currentPlayer === 'x') {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This would be clearer if you used the constants:

Suggested change
if (currentPlayer === 'x') {
if (currentPlayer === PLAYER_1) {

Comment on lines +7 to +23
let onedSquares = [];

for (const row of squares) {
for (const square of row) {
onedSquares.push(square)
}
}

return onedSquares.map((square) => {
return (
<Square
value={ square.value }
id={ square.id }
onClickCallback={ onClickCallback }
/>
)
})

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can use a few built in methods to clean this up.

You can use flat() instead of your first loop:

Suggested change
let onedSquares = [];
for (const row of squares) {
for (const square of row) {
onedSquares.push(square)
}
}
return onedSquares.map((square) => {
return (
<Square
value={ square.value }
id={ square.id }
onClickCallback={ onClickCallback }
/>
)
})
let onedSquares = squares.flat();
return onedSquares.map((square) => {
return (
<Square
value={ square.value }
id={ square.id }
onClickCallback={ onClickCallback }
/>
)
})

And then JS actually includes the built in method flatMap that does a flat followed by a map all in one step:

Suggested change
let onedSquares = [];
for (const row of squares) {
for (const square of row) {
onedSquares.push(square)
}
}
return onedSquares.map((square) => {
return (
<Square
value={ square.value }
id={ square.id }
onClickCallback={ onClickCallback }
/>
)
})
return squares.flatMap((square) => {
return (
<Square
value={ square.value }
id={ square.id }
onClickCallback={ onClickCallback }
/>
)
})

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants