숫자야구게임이란 ?

예를들어 3-8-7-9이란 숫자가 있으면 숫자를 맞출때에 3-5-6-7 이라고 작성하면 1S,1B이 된다.
3이 첫째자리 숫자끼리 같은자리와 숫자가 일치하기에 스트라이크(S)이고, 7이란 숫자가 들어있긴하지만 자리가 다르기에 1B이 된다 !!!

내가 생각한 순서도

이제 쿵쿵따와 계산기를 겪으면서 순서도 그리는 것에 조금의 조금은 익숙해지고 있는 것 같다. 한번 내가 작성한 것과 비교해봐야 겠다.

1. 랜덤으로 4자리 숫자를 뽑는다.(변수에 저장,대기)
2. 비교할 숫자 4자리를 입력한다.
3. for문으로 처음에 입력한 4자리와 비교하려고 입력한 4자리숫자를 비교한다.
4. 숫자 위치와 숫자가 일치하면 S, 숫자 위치가 일치하지 않지만, 같은 숫자가 있으면 B, 숫자의 위치와 들어있지 않은 수이면 아무것도 표시하지 않는다.
5. 몇S,몇B인지 출력한다.

숫자야구게임순서도

• 

1. 무작위로 숫자 뽑기

Math.floor(Math.random() * 9 + 1)

X = {1, 2, 3, 4, 5, 6, 7, 8, 9}

// Mayh.random()은 암호학적으로 완전한 무작위가 아니다. 따라서, 보안과 관련된 작업을 할 경우에는 위험하다.
window.crypto.getRandomValue()
// 보안과 관련된 작업은 위의 함수를 사용하자 

2. 무작위 숫자 4개 뽑기

const numbers = [];
        for (let n = 0; n < 9; n += 1) {
            numbers.push(n + 1);
        }
        const answer = [];
        for (let n = 0; n < 4; n += 1) { // 네 번 반복
            const index = Math.floor(Math.random() * (numbers.length - n)); // 0~8 정수
            answer.push(numbers[index]);
            numbers.splice(index, 1);
        }

배열 : 단순히 값들만 모아놓을때 사용한다.
중괄호 : 각각 값들에 속성 이름을 붙일때 사용한다.

3. 검사하는 코드

const tries = [];
        function checkInput(input) {
            if (input.length !== 4) { // 길이는 4가아닌가
                return alert('4자리 숫자를 입력해 주세요.');
            }
            if (new Set(input).size !== 4) { // 중복된 숫자가 있는가 ,new Set은 중복을 제거한 배열, length 대신 size를 사용한다.
                return alert('중복되지 않게 입력해 주세요.');
            }
            if (tries.includes(input)) { // 이미 시도한 값은 아닌가
                return alert('이미 시도한 값입니다.');
            }
            return true;
        } // 검사하는 코드

4. 몇 볼 몇 스트라이크인지 확인하기

let strike = 0;
    let ball = 0;
    // answer: 3146,  value: 1347
    for (let i = 0; i < answer.length; i++) {
      const index = value.indexOf(answer[i]);
      if (index > -1) { // 일치하는 숫자 발견
        if (index === i) { // 자릿수도 같음
          strike += 1;
        } else { // 숫자만 같음
          ball += 1; 
        }
      }
    }

정리

1. 무작위로 숫자를 뽑을때에는 Math.random으로 숫자를 뽑고, 단, 뽑은 값은 정수가 아니므로정수가 필요하면 바꿔주어야 한다.

• Math.floor : 내림
• Math.ceil : 올림
• Math.round : 반올림

2. 1부터 원하는 숫자가 들어있는 배열 만들기

const number = [];
for  (let n=1; n<=숫자; n+=1) {
	numbers.push(n);
}

3. indexOf와 includes

• indexOf와 includes는 배열이나 문자열에 원하는 값이 들어 있는지 찾는 메서드로 값이 들어있다면 해당 인덱스를 알려주고, 들어 있지 않다면 -1을 반환한다. includes는 좀 더 직관적으로 true/false를 반환한다.

'2345'.indexOF(3) === 1;
'2345'.indexOF(3) === -1;
['2', '3', '4', '5'].indexOf('5') === 3;
['2', '3', '4', '5'].indexOf(5) === -1; // 요소의 자료형까지 같아야한다.
'2345'.includes(3) === true;
['2','3','4','5'].includes(5) === false;

4. document.createElement, document.createTextNode

• 각각 태그와 텍스트를 만드는 메서드이지만, 다른 태그에 append나appendChild하기 전까지는 보이지 않는다.

5. append와 appendChild

• document.createElement, document.createTextNode 로 만든 태그나 텍스트를 선택한 태그의 자식태그로 넣는다. 또한, append로 텍스트를 추가할 때는 document.createTextNode 대신 문자열을 바로 넣어도 된다.

  • append : 여러개를 동시에 넣을 수 있다.
  • appendChild : 하나만 넣을 수 있다.