기록

숫자야구 연습 본문

JS/zerocho - 웹게임강좌

숫자야구 연습

mnmhbbb 2020. 8. 12. 10:50

1. 일단 랜덤한 숫자 4개로 숫자야구 문제를 내는 배열 만들기(공격)

var list = [0,1,2,3,4,5,6,7,8,9];
var number = [];
for (var i = 0; i < 4; i++) {
     var select = Math.floor(Math.random() * list.length);
     number[i] = list.splice(select, 1)[0];
}

 

 

더보기

랜덤한 숫자에 들어갈 숫자들 모음을 배열로 선언해준 다음.

그 숫자들로 랜덤 조합해서 문제 낼 배열도 하나 선언해주고.

랜덤한 숫자를 4번 뽑아야하니까 반복문.

(for문에서 많이 쓰는 i++는 

i 연산을 우선 실행하고, 다음 라인 명령을 실행하기 전에 1 더해주는 녀석)

우선 i = 0이라서 i < 4 가 true니까 

number[i] 라인 실행.

그 전에 var select = Math.floor(Math.random() * list.length); 는 뭐냐면

list.splice()에서 위치를 정해줄 때 쓰려고 선언해둔 건데,

list 자릿수 개수(0~9) 만큼의 숫자 중에서! 랜덤한 숫자를 뽑을 수 있게

간단히 말해서, 숫자 0~9 중 하나를 랜덤으로 뽑아내는 기능을 함.

0자리~9자리 중에 하나를 골라야하니까.

number[i] 에서 i=0인 상태니까 첫번째 숫자를 뽑을 수 있음

list.splice(select에서 선택된 랜덤숫자의 자리에서 1개 선택)

여기서 [0]을 해줌

배열 형태로 출력되기 때문에 그 배열의 첫번째 숫자를 뽑아내기 위해.

이거를 하고 나면 i가 끝났기 때문에 i++해줘서 i=1이 됨

 

 

여기까지 됐으면 이제 조금 어려워짐

 

2. 기회는 10번 뿐이고 볼/스트라이크 판정해주는 기능 만들기.(수비)

var count = 0;
var strike = 0;
var ball = 0;
while (count < 10) { // 숫자를 입력받고 비교를 준비하는 부분
   var input = prompt('숫자를 입력하세요'); // 숫자를 받는 부분-숫자를 입력해도 문자열로 입력됨
   var inputArray = input.split(''); //input 즉 받은 숫자를 배열화 시킴
   strike = 0; // strike와 ball의 개수를 초기화
   ball = 0;
   count++; // 시도 횟수는 하나 증가
 };

 

// 입력받은 숫자를 비교분석하는 부분

for (var j = 0; j < 4; j++) {
      for (var k = 0; k < 4; k++) {
        if (number[j] == inputArray[k]) {
          if (j === k) {
            strike++;
           } else {
            ball++;
           }
            break;
         }
       }
     }

 

더보기

여기가 중요! for 안에 for이 있음

number[0] 과 inputArray[0] 비교하고

number[0] 과 inputArray[1] 비교하고

number[0] 과 inputArray[2] 비교하고

number[0] 과 inputArray[3] 을 비교하기 위함이다.

 

일단 두번째 for 안에 if도 2개가 있는데,

number[j] == inputArray[k] 이 true라면,

숫자도 같은지 비교를 하고,

같다면 strike 틀리면 ball 로 판정한다.

number[0] == inputArray[0] 이 false라면,

이 연산이 끝나고 k++ 으로 넘어간 다음 k=1이 되고 다시 for문 반복됨

 

+break 를 하는 이유

"마지막 break; number[j] inputArray[k]가 같을 경우

다음 자리로 넘어가기 위해 중복문을 하나 break하는겁니다.

break는 모든 중복문을 멈추는 게 아니라 가장 가까운 하나만 멈춥니다.

물론 break를 생략해도 정상 작동하지만,

불필요한 비교를 그만두고 바로 다음 것으로 넘어가라고 알려주는 겁니다.

즉 break는 for문에서 빠져나오는 것입니다!

프로그래밍에서 효율과 성능은 중요하니까요."

 

+

왜 number[j] == inputArray [k] 이렇게 ==으로 비교하냐면

number[j]는 숫자고 inputArray[k]는 문자열이기 때문에

자료형을 제외하고 값!만 비교하기 위해.

 

그렇게 두번째 for문이 끝나면 다시 첫번째 for문으로 넘어가서 

number[1]이 되고 다시 두번째 for문을 시작한다.

 

이런 식으로 반복문이 돌고나면 ball과 strike가 ++ 되어있을거임

이제 결과를 표시해줘야 함

 

 

// 결과를 표시하는 부분

if (strike === 4) {
      console.log('홈런!!! ' + (count - 1) + '번 만에 맞추셨습니다');
      break;
    } else if (count >= 10) {
      console.error('시도 횟수를 초과하셨습니다.');
    } else {
     console.info(inputArray.join('') + ': ' + strike + '스트라이크 ' + ball + '볼');
    }   
}

더보기

count-1 을 하는 이유는

"현재 시도 수에서 1을 미리 더해버립니다.

그래서 콘솔에 출력할 때는 다시 1을 빼줬습니다."

 

정리하면 풀버전은 이러함

var list = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
var number = [];

for (var i = 0; i < 4; i++) {
  var select = Math.floor(Math.random() * list.length);
  number[i] = list.splice(select, 1)[0];
}

var count = 0;
var strike = 0;
var ball = 0;

while (count < 10) {
  var input = prompt("숫자를 입력하세요");

  if (input === null) {
    console.log("취소를 누르셔서 야구 게임이 종료되었습니다.");
  }

  var inputArray = input.split("");

  for (var a = 0; a < 4; a++) {
    for (var b = 0; b < 4; b++) {
      if (a !== b && inputArray[a] == inputArray[b]) {
        console.error("중복되는 숫자가 있습니다."); //반복문과 논리연산자를 통한 중복숫자 알림 기능 추가
        break;
      }
    }
  }

  strike = 0;
  ball = 0;
  count++;

  for (var j = 0; j < 4; j++) {
    for (var k = 0; k < 4; k++) {
      if (number[j] == inputArray[k]) {
        if (j === k) {
          strike++;
        } else {
          ball++;
        }

        break;
      }
    }
  }

  if (strike === 4) {
    console.log("홈런!!! " + (count - 1) + "번 만에 맞추셨습니다");
    break;
  } else if (count >= 10) {
    console.error("시도 횟수를 초과하셨습니다.");
  } else {
    console.info(
      "현재:" +
        count +
        "차시도 " +
        inputArray.join("") +
        ": " +
        strike +
        "스트라이크 " +
        ball +
        "볼"
    );
  }
}

 

  • prompt에서 취소를 눌렀을 때 게임을 종료하도록 업그레이드 (힌트: prompt때 취소를 누르면 input이 null이 됩니다)
  • 중복된 숫자(예: 2254)를 입력했을 때 오류가 표시되도록 업그레이드
  • 몇 번째 시도인지 항상 보여주도록 업그레이드

 

for (var a = 0; a < 4; a++) {
  for (var b = 0; b < 4; b++) {
    if (a !== b && inputArray[a] == inputArray[b]) {
      console.error("중복되는 숫자가 있습니다."); //반복문과 논리연산자를 통한 중복숫자 알림 기능 추가
      break;
    }
  }
}

 

'JS > zerocho - 웹게임강좌' 카테고리의 다른 글

틱택토  (0) 2021.01.26
zerocho js 6 - 로또추첨기  (0) 2020.11.04
zerocho js 4  (0) 2020.08.09
zerocho js 3  (1) 2020.08.08
zerocho js 1,2강  (9) 2020.08.02
Comments