Skip to content

Commit c71f947

Browse files
kaylakremerkaylakremer
committed
refactor: fix typo of function name and improve formatting of code for better readability
1 parent 62b8a8c commit c71f947

File tree

1 file changed

+66
-14
lines changed

1 file changed

+66
-14
lines changed

‎solutions/tic-tac-toe.js

Lines changed: 66 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -89,7 +89,6 @@ const Board = () => {
8989
}
9090

9191
const determineWinner = (playerXSquares, playerOSquares) => {
92-
9392
function checkRows() {
9493
if (
9594
(playerXSquares.includes(0) && playerXSquares.includes(1) && playerXSquares.includes(2)) ||
@@ -106,7 +105,6 @@ const Board = () => {
106105
) {
107106
return setWinner('Player O');
108107
}
109-
110108
}
111109

112110
function checkColumns() {
@@ -127,13 +125,13 @@ const Board = () => {
127125
}
128126
}
129127

130-
function checkDiagnols() {
128+
function checkDiagonals() {
131129
if (playerXSquares.includes(4)) {
132130
if ((playerXSquares.includes(0) && playerXSquares.includes(8)) || (playerXSquares.includes(2) && playerXSquares.includes(6))) {
133131
return setWinner('Player X');
134132
}
135133
}
136-
if (playerOSquares.includes(4)) {
134+
if (playerOSquares.includes(4)) {
137135
if ((playerOSquares.includes(0) && playerOSquares.includes(8)) || (playerOSquares.includes(2) && playerOSquares.includes(6))) {
138136
return setWinner('Player O');
139137
}
@@ -143,7 +141,7 @@ const Board = () => {
143141
if (winner === 'None') {
144142
checkRows();
145143
checkColumns();
146-
checkDiagnols();
144+
checkDiagonals();
147145
}
148146
}
149147

@@ -166,19 +164,73 @@ const Board = () => {
166164
<button onClick={reset} style={buttonStyle}>Reset</button>
167165
<div style={boardStyle}>
168166
<div className="board-row" style={rowStyle}>
169-
<Square disabled={playerXSquares.includes(0) || playerOSquares.includes(0) || winner !== 'None'} playerXSquares={playerXSquares} playerOSquares={playerOSquares} handleClick={handleClick} value={0} />
170-
<Square disabled={playerXSquares.includes(1) || playerOSquares.includes(1) || winner !== 'None'} playerXSquares={playerXSquares} playerOSquares={playerOSquares} handleClick={handleClick} value={1} />
171-
<Square disabled={playerXSquares.includes(2) || playerOSquares.includes(2) || winner !== 'None'} playerXSquares={playerXSquares} playerOSquares={playerOSquares} handleClick={handleClick} value={2} />
167+
<Square
168+
disabled={playerXSquares.includes(0) || playerOSquares.includes(0) || winner !== 'None'}
169+
playerXSquares={playerXSquares}
170+
playerOSquares={playerOSquares}
171+
handleClick={handleClick}
172+
value={0}
173+
/>
174+
<Square
175+
disabled={playerXSquares.includes(1) || playerOSquares.includes(1) || winner !== 'None'}
176+
playerXSquares={playerXSquares}
177+
playerOSquares={playerOSquares}
178+
handleClick={handleClick}
179+
value={1}
180+
/>
181+
<Square
182+
disabled={playerXSquares.includes(2) || playerOSquares.includes(2) || winner !== 'None'}
183+
playerXSquares={playerXSquares}
184+
playerOSquares={playerOSquares}
185+
handleClick={handleClick}
186+
value={2}
187+
/>
172188
</div>
173189
<div className="board-row" style={rowStyle}>
174-
<Square disabled={playerXSquares.includes(2) || playerOSquares.includes(3) || winner !== 'None'} playerXSquares={playerXSquares} playerOSquares={playerOSquares} handleClick={handleClick} value={3} />
175-
<Square disabled={playerXSquares.includes(2) || playerOSquares.includes(4) || winner !== 'None'} playerXSquares={playerXSquares} playerOSquares={playerOSquares} handleClick={handleClick} value={4} />
176-
<Square disabled={playerXSquares.includes(2) || playerOSquares.includes(5) || winner !== 'None'} playerXSquares={playerXSquares} playerOSquares={playerOSquares} handleClick={handleClick} value={5} />
190+
<Square
191+
disabled={playerXSquares.includes(2) || playerOSquares.includes(3) || winner !== 'None'}
192+
playerXSquares={playerXSquares}
193+
playerOSquares={playerOSquares}
194+
handleClick={handleClick}
195+
value={3}
196+
/>
197+
<Square
198+
disabled={playerXSquares.includes(2) || playerOSquares.includes(4) || winner !== 'None'}
199+
playerXSquares={playerXSquares}
200+
playerOSquares={playerOSquares}
201+
handleClick={handleClick}
202+
value={4}
203+
/>
204+
<Square
205+
disabled={playerXSquares.includes(2) || playerOSquares.includes(5) || winner !== 'None'}
206+
playerXSquares={playerXSquares}
207+
playerOSquares={playerOSquares}
208+
handleClick={handleClick}
209+
value={5}
210+
/>
177211
</div>
178212
<div className="board-row" style={rowStyle}>
179-
<Square disabled={playerXSquares.includes(2) || playerOSquares.includes(6) || winner !== 'None'}playerXSquares={playerXSquares} playerOSquares={playerOSquares} handleClick={handleClick} value={6} />
180-
<Square disabled={playerXSquares.includes(2) || playerOSquares.includes(7) || winner !== 'None'}playerXSquares={playerXSquares} playerOSquares={playerOSquares} handleClick={handleClick} value={7} />
181-
<Square disabled={playerXSquares.includes(2) || playerOSquares.includes(8) || winner !== 'None'} playerXSquares={playerXSquares} playerOSquares={playerOSquares} handleClick={handleClick} value={8} />
213+
<Square
214+
disabled={playerXSquares.includes(2) || playerOSquares.includes(6) || winner !== 'None'}
215+
playerXSquares={playerXSquares}
216+
playerOSquares={playerOSquares}
217+
handleClick={handleClick}
218+
value={6}
219+
/>
220+
<Square
221+
disabled={playerXSquares.includes(2) || playerOSquares.includes(7) || winner !== 'None'}
222+
playerXSquares={playerXSquares}
223+
playerOSquares={playerOSquares}
224+
handleClick={handleClick}
225+
value={7}
226+
/>
227+
<Square
228+
disabled={playerXSquares.includes(2) || playerOSquares.includes(8) || winner !== 'None'}
229+
playerXSquares={playerXSquares}
230+
playerOSquares={playerOSquares}
231+
handleClick={handleClick}
232+
value={8}
233+
/>
182234
</div>
183235
</div>
184236
</div>

0 commit comments

Comments
 (0)