오늘은 아침부터 개인과제에 대한 발제가 있었다. 알고리즘 못푼거 좀 더 고민하는 시간이 필요했지만 일단 과제를 하면서 병행해야겠다.
그래서 받은 개인과제는???
터미널에서 자바스크립트로 동작하는 게임 만들기!!
기본적으로 코드를 주고 채워넣는 방식인데
import chalk from 'chalk' ;
import figlet from 'figlet' ;
import readlineSync from 'readline-sync' ;
import { startGame } from './game.js' ;
// 로비 화면을 출력하는 함수
function displayLobby () {
console . clear ();
// 타이틀 텍스트
console . log (
chalk . cyan (
figlet . textSync ( 'RL- Javascript' , {
font : 'Standard' ,
horizontalLayout : 'default' ,
verticalLayout : 'default' ,
}),
),
);
// 상단 경계선
const line = chalk . magentaBright ( '=' . repeat ( 50 ));
console . log ( line );
// 게임 이름
console . log ( chalk . yellowBright . bold ( 'CLI 게임에 오신것을 환영합니다!' ));
// 설명 텍스트
console . log ( chalk . green ( '옵션을 선택해주세요.' ));
console . log ();
// 옵션들
console . log ( chalk . blue ( '1.' ) + chalk . white ( ' 새로운 게임 시작' ));
console . log ( chalk . blue ( '2.' ) + chalk . white ( ' 업적 확인하기' ));
console . log ( chalk . blue ( '3.' ) + chalk . white ( ' 옵션' ));
console . log ( chalk . blue ( '4.' ) + chalk . white ( ' 종료' ));
// 하단 경계선
console . log ( line );
// 하단 설명
console . log ( chalk . gray ( '1-4 사이의 수를 입력한 뒤 엔터를 누르세요.' ));
}
// 유저 입력을 받아 처리하는 함수
function handleUserInput () {
const choice = readlineSync . question ( '입력: ' );
switch ( choice ) {
case '1' :
console . log ( chalk . green ( '게임을 시작합니다.' ));
// 여기에서 새로운 게임 시작 로직을 구현
startGame ();
break ;
case '2' :
console . log ( chalk . yellow ( '구현 준비중입니다.. 게임을 시작하세요' ));
// 업적 확인하기 로직을 구현
handleUserInput ();
break ;
case '3' :
console . log ( chalk . blue ( '구현 준비중입니다.. 게임을 시작하세요' ));
// 옵션 메뉴 로직을 구현
handleUserInput ();
break ;
case '4' :
console . log ( chalk . red ( '게임을 종료합니다.' ));
// 게임 종료 로직을 구현
process . exit ( 0 ); // 게임 종료
break ;
default :
console . log ( chalk . red ( '올바른 선택을 하세요.' ));
handleUserInput (); // 유효하지 않은 입력일 경우 다시 입력 받음
}
}
// 게임 시작 함수
function start () {
displayLobby ();
handleUserInput ();
}
// 게임 실행
start ();
import chalk from 'chalk' ;
import readlineSync from 'readline-sync' ;
class Player {
constructor () {
this . hp = 100 ;
}
attack () {
// 플레이어의 공격
}
}
class Monster {
constructor () {
this . hp = 100 ;
}
attack () {
// 몬스터의 공격
}
}
function displayStatus ( stage , player , monster ) {
console . log ( chalk . magentaBright ( ` \n === Current Status ===` ));
console . log (
chalk . cyanBright ( `| Stage: ${ stage } ` ) +
chalk . blueBright (
`| 플레이어 정보` ,
) +
chalk . redBright (
`| 몬스터 정보 |` ,
),
);
console . log ( chalk . magentaBright ( `===================== \n ` ));
}
const battle = async ( stage , player , monster ) => {
let logs = [];
while ( player . hp > 0 ) {
console . clear ();
displayStatus ( stage , player , monster );
logs . forEach (( log ) => console . log ( log ));
console . log (
chalk . green (
` \n 1. 공격한다 2. 아무것도 하지않는다.` ,
),
);
const choice = readlineSync . question ( '당신의 선택은? ' );
// 플레이어의 선택에 따라 다음 행동 처리
logs . push ( chalk . green ( ` ${ choice } 를 선택하셨습니다.` ));
}
};
export async function startGame () {
console . clear ();
const player = new Player ();
let stage = 1 ;
while ( stage <= 10 ) {
const monster = new Monster ( stage );
await battle ( stage , player , monster );
// 스테이지 클리어 및 게임 종료 조건
stage ++ ;
}
}
일단 장르는 rpg에 로그라이크 방식이고 완전 기본 틀만 줘서 나머지는 내가 채워야한다.
일단 로그라이크 방식의 게임은 많이 해봐서 이것 저것 추가해보고 싶은 욕심은 나지만
벌써부터 머리가 아프다...
이것 저것을 어떻게 추가하지......
너무 막 채운거 같아서 그동안 연습했던 코드 뜯어보기 도전 !!
일단 추가한 코드는
import chalk from 'chalk' ;
import readlineSync from 'readline-sync' ;
class Player {
constructor ( name ) {
this . name = name ;
this . hp = 100 ;
this . attack = 10 ;
this . defense = 10 ;
}
attack ( monster ) {
const damage = Math . floor ( Math . random () * 20 ) + 1 ;
monster . hp -= damage ;
console . log ( `플레이어가 ${ damage } 의 데미지를 줌` );
console . log ( `몬스터의 남은 체력: ${ monster . hp } ` );
}
}
class Monster {
constructor ( name ) {
this . name = name ;
this . hp = 100 ;
this . attack = 5 ;
this . defense = 1 ;
}
attack ( player ) {
const damage = Math . floor ( Math . random () * 20 ) + 1 ;
player . hp -= damage ;
console . log ( `몬스터가 ${ damage } 의 데미지를 줌` );
console . log ( `몬스터의 남은 체력: ${ player . hp } ` );
}
}
function displayStatus ( stage , player , monster ) {
console . log ( chalk . magentaBright ( ` \n === Current Status ===` ));
console . log (
chalk . cyanBright ( `| Stage: ${ stage } ` ) +
chalk . blueBright ( `| 플레이어 정보` ) +
chalk . redBright ( `| 몬스터 정보 |` ),
);
console . log ( chalk . magentaBright ( `===================== \n ` ));
}
const battle = async ( stage , player , monster ) => {
let logs = [];
while ( player . hp > 0 ) {
console . clear ();
displayStatus ( stage , player , monster );
logs . forEach (( log ) => console . log ( log ));
console . log ( chalk . green ( ` \n 1. 공격한다 2. 아무것도 하지않는다.` ));
const choice = readlineSync . question ( '당신의 선택은? ' );
// 플레이어의 선택에 따라 다음 행동 처리
logs . push ( chalk . green ( ` ${ choice } 를 선택하셨습니다.` ));
if ( choice === '1' ) {
player . attack ( monster );
if ( monster . hp <= 0 ) {
console . log ( '몬스터를 쓰러뜨렸습니다!' );
console . log ( '다음 스테이지!' );
break ; // 몬스터가 죽으면 루프 종료
}
} else if ( choice === '2' ) {
// 몬스터 공격
monster . attack ( player );
if ( player . hp <= 0 ) {
console . log ( '플레이어가 쓰러졌습니다!' );
break ;
}
}
}
};
export async function startGame () {
console . clear ();
const player = new Player ();
let stage = 1 ;
while ( stage <= 10 ) {
const monster = new Monster ( stage );
await battle ( stage , player , monster );
if ( player . hp <= 0 ) {
console . log ( '으악' );
break ;
}
// 스테이지 클리어 및 게임 종료 조건
stage ++ ;
}
}
이렇게 되는데
주어진 코드에서 플레이어와 몬스터의 이름 체력 공격력 방어력을 추가하고
공격했을때 몬스터 체력이 달고 가만히 있으면 내가 맞고
그리고 몬스터의 체력이 0일때와 나의 체력이 0일때 나오는 맨트랑
마지막으로 스테이지 클리어시에만 게임이 종료되도록 되어있는데 내 체력이 0이 되면 종료도 추가까지
여기서 오류는 player.attack(monster) 에서 1번을 누르고나서 오류가 나온건데..
혹시나 console.log로 플레이어 객체를 출력 해봤는데
출력은 잘된다.. 뭐가 문제지
console . log ( typeof player . attack );
추가해보기!
타입이 넘버라.....
Player 클래스 안에 넣어놓은 attack으로 읽어서 나오는 오류로 확인!!!!!
당연히 공격력이니 이름을 attack으로 지었는데 attack으로 선언한 함수가 있는걸 왜 몰랐니 ㅠㅠㅠㅠㅠㅠㅠㅠ
그래서 바로 수정하고 실행하니
이건 왜이러니...
플레이어 정보 안에 attack 이름을 안바꿨네 😅😅
아무튼 여기에 시간만 4시간 쓴거 같은데 지금은 스테이지 잘 넘어가고 1번 누르면 몬스터 객체의 체력 2번 누르면 내 체력이 잘 단다.
이제 해야 하는건 내가 공격을 하면 몬스터도 나한테 바로 공격 하게끔 수정을 해야하는데
const battle = async ( stage , player , monster ) => {
let logs = [];
while ( player . hp > 0 ) {
console . clear ();
displayStatus ( stage , player , monster );
logs . forEach (( log ) => console . log ( log ));
console . log ( chalk . green ( ` \n 1. 공격한다 2. 아무것도 하지않는다.` ));
const choice = readlineSync . question ( '당신의 선택은? ' );
logs . push ( chalk . green ( ` ${ choice } 를 선택하셨습니다.` ));
if ( choice === '1' ) {
player . attack ( monster );
if ( monster . hp <= 0 ) {
console . log ( '몬스터를 쓰러뜨렸습니다!' );
console . log ( '다음 스테이지!' );
break ;
}
} else if ( choice === '2' ) {
monster . attack ( player );
if ( player . hp <= 0 ) {
console . log ( '플레이어가 쓰러졌습니다!' );
break ;
}
}
}
};
여기 부분을 손봐야겠다. 1번이랑 2번을 따로 만들었는데 막상 만들고 보니 전투는 주고 받는게 하나라는걸 지금 생각났다...
그리고 생각해보니 1번을 누르면 내가 때리고 몬스터의 스텟이 출력이 되어야하는데
이렇게 나오네..
일단 시간이 많이 지났으니 새벽동안 해결해보는걸로 하고 오늘 기록은 여기까지!!
--------------------------------------------------------------------------------------------------------
오늘의 학습 요약
오늘은 개인 과제에 시간을 많이 투자했는데 넣고싶은건 많은데 기본기 없이 막 넣다보니 막상 만들고 나니 오류 지옥에 이게 여기서 데이터를 가져오는구나 하면서 수정하다보니 의도치 않은 코드 분석을 하게 되었다. 확실히 코드의 구조를 알고 추가했으면 원하는거까지 다 구현을 했을텐데 검색으로만 시간을 너무 많이 썼다. 그래도 주말까지는 구현하고 싶은건 다 할 수 있을 것 같다. 하는 김에 코드도 뜯어보고 구조도 파악하고 좋네 내가 구현하고 싶은건 다 만들고 그걸 이번 기회에 내껄로 만드는 시간을 가져야겠다.
