From 451317f36d27f9fa5863dfb86a5b080c21cc9ed2 Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 01:49:53 +0900 Subject: [PATCH 01/13] =?UTF-8?q?feat:=20=EC=82=AC=EC=9A=A9=EC=9E=90=20?= =?UTF-8?q?=EC=9E=85=EB=A0=A5=EA=B0=92=20=EC=9C=A0=ED=9A=A8=EC=84=B1=20?= =?UTF-8?q?=EA=B2=80=EC=82=AC=20=EB=A1=9C=EC=A7=81=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/isValid.js | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) create mode 100644 src/isValid.js diff --git a/src/isValid.js b/src/isValid.js new file mode 100644 index 00000000..b3ed0f4b --- /dev/null +++ b/src/isValid.js @@ -0,0 +1,28 @@ +export function isValid(userValue){ + // 유효성 검사 + if(isNaN(userValue)){ + alert('숫자만 입력해주세요!'); + return; + } + // 숫자인지 확인 + + if(userValue.length !== 3){ + alert('반드시 3자리 숫자를 입력해주세요!'); + return; + } + // 3자리인지 확인 + + if(new Set(userValue).size !== 3){ + alert('중복된 숫자가 있습니다!'); + return; + } + // 중복을 허용하지 않는 Set 자료형의 특성을 활용 + + if(userValue.includes('0')){ + alert('0은 포함될 수 없습니다. 1~9 사이의 숫자를 입력해주세요.'); + return; + } + // 입력값에 '0'이 있는지 확인 -> 있으면 alert + + return true; +} \ No newline at end of file From 5154389932938d179b50cbd7b98c3feb9d161d48 Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 02:23:17 +0900 Subject: [PATCH 02/13] =?UTF-8?q?feat:=20HTML=20=EC=9A=94=EC=86=8C(DOM)=20?= =?UTF-8?q?=EC=A0=91=EA=B7=BC=EC=9D=84=20=EC=9C=84=ED=95=9C=20=EB=B3=80?= =?UTF-8?q?=EC=88=98=20=EC=B4=88=EA=B8=B0=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.js | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) create mode 100644 src/index.js diff --git a/src/index.js b/src/index.js new file mode 100644 index 00000000..3fcd1313 --- /dev/null +++ b/src/index.js @@ -0,0 +1,18 @@ +import { isValid } from "./isValid.js"; + +export default class BaseballGame { + constructor(){ + // 1. 부품(DOM) 가져오기: HTML 요소를 클래스 내부 변수(this)에 저장 + this.userInput = document.querySelector('#user-input'); + this.submit = document.querySelector('#submit'); + this.result = document.querySelector('#result'); + this.restart = document.querySelector('#game-restart-button'); + + // 재시작 버튼 숨기기 + this.restart.style.display = 'none'; + + + } +} + +new BaseballGame(); \ No newline at end of file From 7ed38c3ece7ba5514e8fdf3c0134a0f55508b714 Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 02:28:22 +0900 Subject: [PATCH 03/13] =?UTF-8?q?feat:=201=EC=97=90=EC=84=9C=209=20?= =?UTF-8?q?=EC=82=AC=EC=9D=B4=EC=9D=98=20=EC=84=9C=EB=A1=9C=20=EB=8B=A4?= =?UTF-8?q?=EB=A5=B8=20=EC=9E=84=EC=9D=98=EC=9D=98=20=EC=88=98=203?= =?UTF-8?q?=EA=B0=9C=20=EC=83=9D=EC=84=B1=ED=95=98=EB=8A=94=20=EA=B8=B0?= =?UTF-8?q?=EB=8A=A5=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/index.js b/src/index.js index 3fcd1313..beaf2ac4 100644 --- a/src/index.js +++ b/src/index.js @@ -11,8 +11,22 @@ export default class BaseballGame { // 재시작 버튼 숨기기 this.restart.style.display = 'none'; + // 초기 상태 설정: 컴퓨터 숫자 생성 + this.computerNumbers = this.generateComputerNumbers(); + // 시스템 작동 시작: 이벤트(사용자 신호) 받을 준비 + this.initEventListeners(); } + // 컴퓨터 숫자 생성 (중복 없는 난수 3개) + generateComputerNumbers() { + const numbers = []; + while (numbers.length < 3) { + const number = MissionUtils.Random.pickNumberInRange(1, 9); + if (!numbers.includes(number)) numbers.push(number); + } + return numbers; + } + } new BaseballGame(); \ No newline at end of file From 5d69b148eed6587eb83ed5a85136f6fbe4c2436c Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 02:35:09 +0900 Subject: [PATCH 04/13] =?UTF-8?q?feat:=20=EC=82=AC=EC=9A=A9=EC=9E=90=20?= =?UTF-8?q?=EC=9E=85=EB=A0=A5=20=EC=9D=B4=EB=B2=A4=ED=8A=B8=20=EA=B4=80?= =?UTF-8?q?=EB=A6=AC=20=EB=B0=8F=20=EC=9C=A0=ED=9A=A8=EC=84=B1=20=EA=B2=80?= =?UTF-8?q?=EC=82=AC=20=EC=97=B0=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.js | 43 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 43 insertions(+) diff --git a/src/index.js b/src/index.js index beaf2ac4..e8d99cbf 100644 --- a/src/index.js +++ b/src/index.js @@ -27,6 +27,49 @@ export default class BaseballGame { return numbers; } + // 이벤트 관리 (사용자 입력과 시스템 반응을 연결) + initEventListeners() { + // HTML 태그 안에 직접 이렇게 적어도 구현 가능 + this.restart.style.display = 'block'; + + }else{ + this.result.textContent=resultText; + // 평소엔 숨기기 + this.restart.style.display='none'; + } + }); + + this.restart.addEventListener('click', ()=>{ + this.RestartEvent(); + }); + } + } new BaseballGame(); \ No newline at end of file From c32e988fcf10b064e8d61adbc33ec7b048da0319 Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 02:37:12 +0900 Subject: [PATCH 05/13] =?UTF-8?q?feat:=20=EC=8A=A4=ED=8A=B8=EB=9D=BC?= =?UTF-8?q?=EC=9D=B4=ED=81=AC=20=EB=B0=8F=20=EB=B3=BC=20=EA=B0=9C=EC=88=98?= =?UTF-8?q?=20=ED=8C=90=EC=A0=95=20=EB=A1=9C=EC=A7=81=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.js | 42 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 42 insertions(+) diff --git a/src/index.js b/src/index.js index e8d99cbf..f4c239ef 100644 --- a/src/index.js +++ b/src/index.js @@ -69,6 +69,48 @@ export default class BaseballGame { this.RestartEvent(); }); } + + // 스트라이크/볼 판정 + play(computerInputNumbers, userInputNumbers) { + + let strike = 0; + let ball = 0; + + for(let i=0;i<3;i++){ + const userDigit=Number(userInputNumbers[i]); + //userInput.value로 가져온 값은 무조건 글자 상태로 들어오기 때문에 + // Number()을 써서 숫자로 변환 + if(userDigit===computerInputNumbers[i]){ + strike++; + }else if (computerInputNumbers.includes(userDigit)){ + ball++; + } + } + // 조건에 맞춰 문자열로 출력 + if (strike===0 && ball===0){ + return "낫싱"; + } + if(strike===3){ + return "3스트라이크" + } + // string으로 출력하는 방식 + // 1. 템플릿 리터럴: 백틱(` `)과 ${} 사용 (대부분 템플릿 리터럴 사용함) + // 2. 문자열 연결 연산자: (+) 기호 사용 + // 3. 배열 합치기(join): result.join(" ") 사용 + // 볼과 스트라이크가 있을수도 없을수도 있으니 join 사용함 + const result = []; + + if(ball > 0){ + result.push(`${ball}볼`); + } + + if(strike > 0){ + result.push(`${strike}스트라이크`); + } + + return result.join(" "); + + } } From 8b6b86883822143f7e7b612e8f063f6e1b651791 Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 02:42:49 +0900 Subject: [PATCH 06/13] =?UTF-8?q?feat:=20=EA=B2=8C=EC=9E=84=20=EC=9E=AC?= =?UTF-8?q?=EC=8B=9C=EC=9E=91=20=EA=B8=B0=EB=8A=A5=20=EA=B5=AC=ED=98=84=20?= =?UTF-8?q?=EB=B0=8F=20=EC=A0=84=EC=B2=B4=20=ED=94=84=EB=A1=9C=EA=B7=B8?= =?UTF-8?q?=EB=9E=A8=20=EC=8B=9C=EC=9E=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.js | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/index.js b/src/index.js index f4c239ef..79960b86 100644 --- a/src/index.js +++ b/src/index.js @@ -110,8 +110,14 @@ export default class BaseballGame { return result.join(" "); - } - + } + + // 시스템 리셋 + RestartEvent(){ + this.computerNumbers = this.generateComputerNumbers(); + this.result.innerHTML = ''; + this.restart.style.display = 'none'; + } } new BaseballGame(); \ No newline at end of file From fc3ca4dc5e2014d78db3c7047df2c856f02e58df Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 16:50:29 +0900 Subject: [PATCH 07/13] =?UTF-8?q?feat:=20=EC=9C=A0=ED=9A=A8=EC=84=B1=20?= =?UTF-8?q?=EA=B2=80=EC=82=AC=20=EB=A1=9C=EC=A7=81=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/models/isValid.js | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) create mode 100644 src/models/isValid.js diff --git a/src/models/isValid.js b/src/models/isValid.js new file mode 100644 index 00000000..b3ed0f4b --- /dev/null +++ b/src/models/isValid.js @@ -0,0 +1,28 @@ +export function isValid(userValue){ + // 유효성 검사 + if(isNaN(userValue)){ + alert('숫자만 입력해주세요!'); + return; + } + // 숫자인지 확인 + + if(userValue.length !== 3){ + alert('반드시 3자리 숫자를 입력해주세요!'); + return; + } + // 3자리인지 확인 + + if(new Set(userValue).size !== 3){ + alert('중복된 숫자가 있습니다!'); + return; + } + // 중복을 허용하지 않는 Set 자료형의 특성을 활용 + + if(userValue.includes('0')){ + alert('0은 포함될 수 없습니다. 1~9 사이의 숫자를 입력해주세요.'); + return; + } + // 입력값에 '0'이 있는지 확인 -> 있으면 alert + + return true; +} \ No newline at end of file From 6576b1434aea13c17123007c2e933786bb6a1f88 Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 16:59:52 +0900 Subject: [PATCH 08/13] =?UTF-8?q?refactor:=20MVC=20=ED=8C=A8=ED=84=B4=20?= =?UTF-8?q?=EB=8F=84=EC=9E=85=20=EB=B0=8F=20models=20=ED=8F=B4=EB=8D=94?= =?UTF-8?q?=EB=A1=9C=20=EC=9D=B4=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/isValid.js | 28 ---------------------------- src/models/isValid.js | 1 + 2 files changed, 1 insertion(+), 28 deletions(-) delete mode 100644 src/isValid.js diff --git a/src/isValid.js b/src/isValid.js deleted file mode 100644 index b3ed0f4b..00000000 --- a/src/isValid.js +++ /dev/null @@ -1,28 +0,0 @@ -export function isValid(userValue){ - // 유효성 검사 - if(isNaN(userValue)){ - alert('숫자만 입력해주세요!'); - return; - } - // 숫자인지 확인 - - if(userValue.length !== 3){ - alert('반드시 3자리 숫자를 입력해주세요!'); - return; - } - // 3자리인지 확인 - - if(new Set(userValue).size !== 3){ - alert('중복된 숫자가 있습니다!'); - return; - } - // 중복을 허용하지 않는 Set 자료형의 특성을 활용 - - if(userValue.includes('0')){ - alert('0은 포함될 수 없습니다. 1~9 사이의 숫자를 입력해주세요.'); - return; - } - // 입력값에 '0'이 있는지 확인 -> 있으면 alert - - return true; -} \ No newline at end of file diff --git a/src/models/isValid.js b/src/models/isValid.js index b3ed0f4b..2c708ccc 100644 --- a/src/models/isValid.js +++ b/src/models/isValid.js @@ -25,4 +25,5 @@ export function isValid(userValue){ // 입력값에 '0'이 있는지 확인 -> 있으면 alert return true; + } \ No newline at end of file From a091ebd62c3abd8b56fd53a7a810ba8db6e24c2d Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 17:01:58 +0900 Subject: [PATCH 09/13] =?UTF-8?q?docs:=20MVC=20=ED=8C=A8=ED=84=B4=20?= =?UTF-8?q?=EA=B8=B0=EB=B0=98=20=EA=B8=B0=EB=8A=A5=20=EA=B5=AC=ED=98=84=20?= =?UTF-8?q?=EB=AA=A9=EB=A1=9D=20=EC=9E=91=EC=84=B1=20=EB=B0=8F=20=EC=84=A4?= =?UTF-8?q?=EA=B3=84=20=EA=B3=84=ED=9A=8D=20=EC=88=98=EB=A6=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/README.md | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) create mode 100644 docs/README.md diff --git a/docs/README.md b/docs/README.md new file mode 100644 index 00000000..195955dc --- /dev/null +++ b/docs/README.md @@ -0,0 +1,22 @@ +# 숫자 야구 게임 기능 구현 미션 + +## 기능 구현 목록 + +### MVC 패턴으로 분류 + +- 게임 흐름 제어 (BaseballController.js) + - 확인 버튼 클릭 시 유효성 검사 및 판정 로직 실행 + - 재시작 버튼 클릭 시 모델 과 뷰 초기화 후, 새 게임 시작 + +- 게임 데이터 관리 (BaseballModel.js) + - 컴퓨터의 서로 다른 임의의 수 3개 생성 + - 사용자의 입력값과 컴퓨터의 숫자를 비교 후 스트라이크/볼 판정 + - 게임 재시작 시 새로운 정답 숫자 생성 후 데이터 초기화 + +- 유효성 검사 (isValid.js) + - 3자리 숫자가 아니거나, 중복된 숫자가 있거나 0이 포함된 경우 alert 메시지 띄움 + +- 사용자 인터페이스 (BaseballView.js) + - 사용자가 입력한 숫자에 대한 힌트를 화면에 출력 + - 정답을 맞췄을 경우 축하 메시지와 재시작 버튼 표시 + - 재시작 버튼 클릭 시 입력창과 결과창 초기화 From 49dc5ae368d63e5f451e3348fc2d2ba9f13cfab4 Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 17:04:19 +0900 Subject: [PATCH 10/13] =?UTF-8?q?refactor:=20=EA=B2=8C=EC=9E=84=20?= =?UTF-8?q?=EB=8D=B0=EC=9D=B4=ED=84=B0=20=EB=B0=8F=20=ED=8C=90=EC=A0=95=20?= =?UTF-8?q?=EB=A1=9C=EC=A7=81=EC=9D=84=20BaseballModel=EB=A1=9C=20?= =?UTF-8?q?=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/models/BaseballModel.js | 64 +++++++++++++++++++++++++++++++++++++ 1 file changed, 64 insertions(+) create mode 100644 src/models/BaseballModel.js diff --git a/src/models/BaseballModel.js b/src/models/BaseballModel.js new file mode 100644 index 00000000..ac4265f4 --- /dev/null +++ b/src/models/BaseballModel.js @@ -0,0 +1,64 @@ +//데이터의 생성, 저장, 처리를 전담 + +export default class BaseballModel { + constructor(){ + this.computerInputNumbers=this.generateComputerNumbers(); + } + + // 컴퓨터 숫자 생성 (중복 없는 난수 3개) + generateComputerNumbers() { + const numbers = []; + while (numbers.length < 3) { + const number = MissionUtils.Random.pickNumberInRange(1, 9); + if (!numbers.includes(number)) numbers.push(number); + } + return numbers; + } + + play(userInputNumbers){ + // 스트라이크/볼 판정 + let strike = 0; + let ball = 0; + + for(let i=0;i<3;i++){ + const userDigit=Number(userInputNumbers[i]); + //userInput.value로 가져온 값은 무조건 글자 상태로 들어오기 때문에 + // Number()을 써서 숫자로 변환 + if(userDigit===this.computerInputNumbers[i]){ + strike++; + }else if (this.computerInputNumbers.includes(userDigit)){ + ball++; + } + } + // 조건에 맞춰 문자열로 출력 + if (strike === 0 && ball === 0){ + return "낫싱"; + } + if(strike === 3){ + return "3스트라이크" + } + // string으로 출력하는 방식 + // 1. 템플릿 리터럴: 백틱(` `)과 ${} 사용 (대부분 템플릿 리터럴 사용함) + // 2. 문자열 연결 연산자: (+) 기호 사용 + // 3. 배열 합치기(join): result.join(" ") 사용 + // 볼과 스트라이크가 있을수도 없을수도 있으니 join 사용함 + const result = []; + + if(ball > 0){ + result.push(`${ball}볼`); + } + + if(strike > 0){ + result.push(`${strike}스트라이크`); + } + + return result.join(" "); + + } + + prepareNewGame(){ + // 컴퓨터 숫자를 생성하는 로직은 게임의 핵심 데이터라 생각해서 + // view로 전부 이사시키지 않고 Model로 분류함 + this.computerInputNumbers = this.generateComputerNumbers(); + } +} \ No newline at end of file From a120a035ea33a3bff90e5f645bbd226a053823aa Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 17:04:54 +0900 Subject: [PATCH 11/13] =?UTF-8?q?refactor:=20UI=20=EC=A1=B0=EC=9E=91=20?= =?UTF-8?q?=EB=B0=8F=20=EA=B2=B0=EA=B3=BC=20=EC=B6=9C=EB=A0=A5=20=EB=A1=9C?= =?UTF-8?q?=EC=A7=81=EC=9D=84=20BaseballView=EB=A1=9C=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/BaseballView.js | 38 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 38 insertions(+) create mode 100644 src/views/BaseballView.js diff --git a/src/views/BaseballView.js b/src/views/BaseballView.js new file mode 100644 index 00000000..fe6eba90 --- /dev/null +++ b/src/views/BaseballView.js @@ -0,0 +1,38 @@ +export default class BaseballView { + constructor(){ + // 1. 부품(DOM) 가져오기: HTML 요소를 클래스 내부 변수(this)에 저장 + this.userInput = document.querySelector('#user-input'); + this.submit = document.querySelector('#submit'); + this.result = document.querySelector('#result'); + this.restart = document.querySelector('#game-restart-button'); + + // 재시작 버튼 숨기기 + this.restart.style.display = 'none'; + } + + displayHint(text){ + this.result.textContent=text; + // 평소엔 숨기기 + this.restart.style.display='none'; + } + + displaySuccess(){ + // 정답 시 원래 있던 결과창 글자를 싹 + // 지우고 축하 문구 및 재시작 버튼 활성화 + this.result.innerHTML = ` +
🎉 정답을 맞추셨습니다 🎉
+
게임을 새로 시작하시겠습니까? + `; + // textContent (변수만 섞인 글자를 보여줄 때) + // testContent로 `${strike}스트라이크` 할당하면 그대로 출력됨 + + // innerHTML (버튼이나 문단 같은 HTML 구조를 통째로 만들어서 끼워 넣고 싶을 때 사용) + // 백틱 사이에 이렇게 적어도 구현 가능 + this.restart.style.display = 'block'; + } + + restartUI(){ + this.result.innerHTML = ''; + this.restart.style.display = 'none'; + } +} \ No newline at end of file From 3d9d74676e48ee29424713782d681bbe3c23c1ac Mon Sep 17 00:00:00 2001 From: gyuminJJANG Date: Tue, 17 Mar 2026 17:06:13 +0900 Subject: [PATCH 12/13] =?UTF-8?q?refactor:=20Model=EA=B3=BC=20View?= =?UTF-8?q?=EC=A1=B0=EC=9C=A8=ED=95=98=EB=8A=94=20=ED=9D=90=EB=A6=84=20?= =?UTF-8?q?=EC=A0=9C=EC=96=B4=20=EB=A1=9C=EC=A7=81=EC=9D=84=20BaseballCont?= =?UTF-8?q?roller=EB=A1=9C=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/controllers/BaseballController.js | 39 +++++++++++++++++++++++++++ 1 file changed, 39 insertions(+) create mode 100644 src/controllers/BaseballController.js diff --git a/src/controllers/BaseballController.js b/src/controllers/BaseballController.js new file mode 100644 index 00000000..41456f77 --- /dev/null +++ b/src/controllers/BaseballController.js @@ -0,0 +1,39 @@ +import BaseballModel from '../models/BaseballModel.js'; +import BaseballView from '../views/BaseballView.js'; +import { isValid } from '../models/isValid.js'; + +export default class BaseballControllor { + constructor(){ + this.model=new BaseballModel(); + this.view=new BaseballView(); + this.initEventListeners(); + } + initEventListeners(){ + // HTML 태그 안에 직접 이렇게 적어도 구현 가능 - this.restart.style.display = 'block'; - - }else{ - this.result.textContent=resultText; - // 평소엔 숨기기 - this.restart.style.display='none'; - } - }); - - this.restart.addEventListener('click', ()=>{ - this.RestartEvent(); - }); - } - - // 스트라이크/볼 판정 - play(computerInputNumbers, userInputNumbers) { - - let strike = 0; - let ball = 0; - - for(let i=0;i<3;i++){ - const userDigit=Number(userInputNumbers[i]); - //userInput.value로 가져온 값은 무조건 글자 상태로 들어오기 때문에 - // Number()을 써서 숫자로 변환 - if(userDigit===computerInputNumbers[i]){ - strike++; - }else if (computerInputNumbers.includes(userDigit)){ - ball++; - } - } - // 조건에 맞춰 문자열로 출력 - if (strike===0 && ball===0){ - return "낫싱"; - } - if(strike===3){ - return "3스트라이크" - } - // string으로 출력하는 방식 - // 1. 템플릿 리터럴: 백틱(` `)과 ${} 사용 (대부분 템플릿 리터럴 사용함) - // 2. 문자열 연결 연산자: (+) 기호 사용 - // 3. 배열 합치기(join): result.join(" ") 사용 - // 볼과 스트라이크가 있을수도 없을수도 있으니 join 사용함 - const result = []; - - if(ball > 0){ - result.push(`${ball}볼`); - } - - if(strike > 0){ - result.push(`${strike}스트라이크`); - } - - return result.join(" "); - - } - - // 시스템 리셋 - RestartEvent(){ - this.computerNumbers = this.generateComputerNumbers(); - this.result.innerHTML = ''; - this.restart.style.display = 'none'; - } -} - -new BaseballGame(); \ No newline at end of file +//게임 실행 +new BaseballControllor(); \ No newline at end of file