JavaScript 입문 : 가위바위보 게임 - 코드 줄이기

이 글은 제로초 TV의 자바스크립트 강좌를 기본으로 하고 있습니다. 

 

지난시간 if문을 사용하여 가위바위보 게임을 만들어 보았습니다. 다음과 같은 코딩을 사용하였는데 이 상태로도 물론 프로그램이 돌아가기 때문에 더 이상 정리할 필요성은 없어 보이는데 강좌에 따르면 중복되는 부분을 찾아서 코드를 줄이는 연습을 합니다. 우선 어떤 형태가 있는지 확인하고  최종적으로는 어떤 코드가 더 편한지 스스로 판단해 봐야 겠습니다. 

 

무작정 코드를 줄인다고 해서 능사는 아닌 듯 합니다. 최소한 나중에 봤을때 읽을 수 있고 이해할 수 있는 코드가 훨씬 더 좋지 않을까 생각해 봅니다만..

 

1. 가위바위보 JS코드 기본 

 

가위바위보 게임 기본 JS

 

2. 중복코드 줄이기 

 

상기 기본 JS코드에서 if문 자체가 너무길고 뭔가 중복된 느낌이 있지만 그렇다고 꼭 중복되었다고 볼 수는 없습니다. 그래도 코드를 간단히 하고 점수를 계산할 수 있는 방법이 있는지 고민해 볼 필요가 있습니다. 

 

① 규칙찾기

 

우리같이 초보들은 한번에 규칙을 찾을 수는 없지만 여러가지 도움을 받아 훈련을 할 필요성은 있습니다. 일단, 각 if문에 많이 사용되는 내용은 승리, 패배, 무승부라는 용어인데 이 부분을 하나로 줄일 수 있다면 좀 더 간략한 코드가 될 수 있을 듯 합니다. 

 

그러기 위해서는 점수와 가위바위보 관계를 보고 공통점을 만들어 내야 하고 해당 공통점을 통하여 점수를 계산할 수 있어야 합니다. 

 

② 승패관련 점수화 시키기 (점수테이블)

 

공통점을 숫자화 시킨다는 것은 많은 경험이 있어야 생각이 나겠지요. 가위 바위 보에 숫자를 부여하여 객체화 시키고 해당 숫자를 계산해서 승패에 대한 점수를 내는 방법을 고민해 봅니다. 

 

그러기 위해서는 내가 낸 결과와 컴퓨터가 낸 결과를 계산하는 테이블을 만들 필요성이 있는데 다음과 같은 테이블을 만들어 봅니다. 

 

 

뭔가 규칙을 찾을 수 있을 듯 합니다. 무승부도 대각선으로 이어져 있고요. 가위를 1, 바위를 0, 보를 -1로 설정하고 점수계산을 해보면 다음과 같이 나올 수 있습니다. 

 

물론 가위, 바위, 보를 다른 점수로 놓을 수 있지만 보통 대칭을 이루도록 하는게 좋습니다. 

 

각각의 경우에서 공통점을 찾기 위헤 기본적으로 사칙계산하면 다음과 같이 나올 수 있으며 여기서 규칙을 만들 수 있습니다.

이 경우에서는 내점수와 컴퓨터 점수를 뺀 경우에서 규칙을 만들 수 있어 보입니다. 

 

 

③ 변수만들기 

 

상기 두번째 경우를 가지고 변수를 만들어 보면 간단한 코딩이 가능할 수 있습니다. 

필요한 변수는 점수테이블과 각 경우의 수를 뺀 경우가 필요하겠군요.

 

④ if문 줄이기 : 컴퓨터와의 게임 규칙

 

변수를 각각 설정하였으니 if문은 승패와 무승부만을 가지고 설정합니다.  점수테이블을 보면 무승부의 경우 결과값이 전부 0입니다. 승리의 경우 -1과 2이고 패배는 -2와 1입니다. 

 

 

무승부, 승리, 패배만 가지고 코드를 줄여서 사용할 수 있었습니다. 여기가지만 하면 기본적으로 줄이는 데는 성공한 것으로 봐도 무방하리라 보여지며 강좌에서는 includes( )를 사용하여 다음과 같이 좀 더 줄였는데 이 구문은 참조로만 하면 될 듯 합니다. 

 

⑤ includes( )를 이용하여 줄이기 (참조)