11.4

승패 판단하기

마지막으로 승패를 판단하는 부분을 작성해 보겠습니다. 가로줄, 세로줄, 대각선 3칸에 같은 모양이 오면 승리입니다. 승패가 가려지면 누가 승자인지 div 태그를 만들어 표시합니다. 9칸을 다 채웠는데도 승자가 없다면 ‘무승부’라는 메시지를 표시합니다.

승패를 판단하는 checkWinner() 함수부터 만듭니다. 현재 클릭한 td가 몇 행, 몇 열인지 파악하고 가로줄, 세로줄, 대각선에 같은 모양이 있는지 검사합니다. 같은 모양이 있다면 hasWinner를 true로 만듭니다.