텍스트 로그라이크 코드

728x90

이번 과제에서 고려해야 할 사항

◆ 트러블 슈팅

좋은 트러블 슈팅 사례, 형식을 찾아보고 트러블 슈팅을 작성하고 발표해 주세요

배경 : 어떤 현상을 발견해서

발단 : 이런 장애가 생길 수 있다는 것을 인지했고,

전개 : 장애를 대응, 해결하던 와중에

위기 : 또 다른 장애 발견 또는 간단하게 해결할 수 없다는 것을 알게되어서,

절정 : 근본적인 해결을 위해 이런 방법으로 접근하였다.

결말 : 따라서, 이런이런 방법을 통해 근본적으로 해결 및 앞으로 유지, 보수에 용이하게 개선하게 되었다.

◆ 과제 필수요건 채우기

완성도	필수	필수 기능 - 단순 행동 패턴 2가지 구현 - 클래스 문법 활용, 플레이어 스탯 관리 - 간단한 전투 로직 구현 - 스테이지 진행에 따른 이벤트 관리
	도전	도전 기능 - 확률 로직 적용 - 복잡한 행동 패턴 구현 - 새로운 기능 구현- 전체적인 코드 흐름
이해도	필수	- TIL에 트러블슈팅 과정을 기록해보세요. (과제 제출란에 TIL 링크를 제출해주세요.)
	도전	- 디렉토리 및 파일을 분리해보세요.- 변수명 등 코드를 직관적이고 이해하기 쉽게 작성해보세요.- 주석을 활용해 코드를 설명해보세요.
우수성	필수	- ReadMe를 작성해 과제를 소개해보세요.
	도전	- 특수 상황에 대한 예외 처리를 2가지 이상 구현해보세요.- 커밋 컨벤션을 지킨 커밋을 10회 이상 시행해보세요.

필수 기능 구현을 우선적으로 완성한 후, 도전 기능에도 도전하여 실력을 더욱 강화해 주시기 바랍니다. 각 기능의 구현 상태에 따라 평가가 이루어지며, 이는 팀 구성과 추후의 팀 프로젝트 성공에 큰 영향을 미칠 수 있습니다. 최선을 다해 모든 기능을 완성해 주시기 바랍니다!

필수 기능 가이드

1. 단순 행동 패턴 2가지 구현

- 공격하기

- 도망치기

2. 플레이어 클래스에서 플레이어 스탯 (공격력, 체력 등) 관리하기

3. 간단한 전투 로직 구현

- 플레이어 공격, 몬스터 피격

4. 스테이지 클리어 시 유저 체력 회복

5. 스테이지의 진행과 비례해서 몬스터의 체력과 공격력 증가 시키기

필수 기능 공통 가이드

1. switch 분기문을 사용하여 유저의 각 행동에 대한 로직을 처리해보세요.

2. while 반복문을 사용할 때는 종료 조건이 무조건 있어야 합니다.

a. 스테이지 클리어 및 게임 종료 조건

b. 몬스터와의 전투 종료 조건

3. Math.random()메서드를 통해서 랜덤한 숫자를 얻을 수 있습니다.

4. 플레이어의 공격은 선택에 의해서 이루어지지만, 몬스터의 공격은 자동으로 처리가 된 뒤 해당 플레이어의 로그에 보여지게 됩니다.

5. 함수의 호출 순서에 따라서 각 변수, 객체들을 관리하는 것이 중요합니다.

도전 기능 가이드

1. 확률 로직 적용

- 연속 공격, 방어, 도망치기

- 스테이지 클리어시 유저 능력치 증가, 증가량

- 몬스터의 공격력, 체력 증가량

2. 복잡한 행동 패턴 구현

- 연속 공격

- 방어하기

그 외 다른 행동

도전 기능 공통 가이드

1.랜덤, 확률을 사용하는 것을 어렵게 생각하지 마세요.

a. Math.random() 메서드를 응용하여 0~5 사이의 정수가 랜덤으로 생성된다고 가정할 때, 우리는 [0,1,2,3,4,5]의 6가지 랜덤한 선택지를 가질 수 있게됩니다.

b. 확률의 경우도 마찬가지로 Math.random() 메서드를 응용하여 0~99 사이의 정수를 생성한다고 할 때, 10%의 확률은 0~9사이의 숫자가 생성될 확률이랑 같습니다.

2. 새로운 기능을 추가하는 것을 망설이지 마세요!

시나리오

산책하다 도와주는 북극곰 베르노( 따뜻함과 평온함을 상징하는 라틴어에서 유래된 이름.)

빙하기가 찾아온 지구. 심심해진 북극곰 베르노는 여행을 가기로 했습니다.

ex) 길 앞에 다람쥐 들이 얼음 속에서 도토리를 꺼내려 고생하고 있네요. 도와주시겠습니까?

1. 도와준다 2. 무시한다

도와주는 목적 : 음식, 아이템 얻기

◆주요 퀘스트 : 얼음에서 물건 꺼내기

▷사람의 경우 : 높은 확률로 공격, 완료 시 라이터, 라면 등 레어탬 지급

■사람을 만났다. 도와줄까 ? 피할까?

○ 자동 랜덤 이벤트( 접근만해도 공격 / ~~도와주고 공격당하기~~ / 도와주고 얻어먹기 )

- 사람이 공격함 : 1. 싸움, 2. 도망가기

- 사람 내구력 랜덤 설정, 스테이지 올라가면 증가

a. 싸움 : 1. 일반 공격 2. 양 팔로 때리기(쿨타임 만들기) ( 데미지 랜덤) 3. 방어하기(이번텀 공격있으면 데미지0) 4. 도망가기(아래 b.로 이동)

총을 맞았다/ 칼에 맞았다/주먹에 맞았다/ 차엿다 < 랜덤 hp 깎기

이기면 아이템 획득, 포만감 up

사망 시 패배. (지는 조건 : 포만감0 or 체력0)

스테이지 5 이후로 전투 자동 결과, 연속타격(3회?) 기능 만들기

- 사람이 공격함 : 1. 싸움, 2. 도망가기, 3. 전투 자동 진행

- 사람 내구력 랜덤 설정, 스테이지 올라가면 증가

a. 싸움 : 1. 3회 연속공격(3회차 랜덤 데미지 주고받기) 2. 일반 공격 3. 양 팔로 때리기(쿨타임 만들기) ( 데미지 랜덤) 4. 방어하기(이번텀 공격있으면 데미지0) 5. 도망가기(아래 b.로 이동)

총을 맞았다/ 칼에 맞았다/주먹에 맞았다/ 차엿다 < 랜덤 hp 깎기

b. 도망가기: 스테이지넘버 유지, 이벤트 새로 생성 전에 console.log('길을 따라 걷는다')같은거 출력

▷ 동물의 경우 : 다양한 음식 득탬. 소소한 포만감, 행복지수 up

■울버린/ 아기곰/ 다람쥐 를 만났다. (1. 도와준다, 2. 무시한다)

얼음 깨는 과정에서 랜덤으로 얼음에 의한 상처 받음-> 행복or Hp 깎기

음식에 따라 포만감 설정하기

1. 도와주자

-얼음 내구도 랜덤 설정, 스테이지 올라가면 내구도 올리기

- 얼음을 부수자 (1. 부수기) - 얼음 내구도 데미지 랜덤, 20번 안에 끝내자

1. 부수기 선택 할 때마다 얼음 깨는 과정에서 랜덤으로 얼음에 의한 상처 받음-> 행복or Hp 깎기

얼음 깨기 성공 시 얼음 안의 내용물 나눠받음 (음식에 따라 포만감 설정하기)

2. 무시한다 : 스테이지넘버 유지, 이벤트 새로 생성 전에 console.log('길을 따라 걷는다')같은거 출력

◆ 사이드 퀘스트 : ~~잠자리 만들기~~/ 불 피우기 / 공복- 받은거 먹기?

▷불 피우기( 1. O , 2. X)

■ 나뭇가지 모으기

■ 라이터여부로 불 붙이는 방법 차이.

-라이터 사용해서 불 붙이기(1. O , 2. X)

가방에 라이터 없으면 손으로 비비기

▷음식 먹기

소지한 아이템 중에 고르기. 라면은 불피우기 쿼스트 건너뛰면 사용못함

불피우기 건너뛰면 다음 스테이지로 넘어가기 전에 행복 깎기

◆ 게임 결과

행복도 기준으로

80~100 : 즐겨운 여행을 마친 베르노. 행복하게 집으로 돌아갑니다.

40~80 : 괜찮은 여행이었어요. 이번엔 어디로 여행을 가볼까요?

10~40 : 힘들어요 ㅠㅠ 어서 집으로 돌아가고 싶네요

0~10 : 괜히 나왔어. 집으로 돌아갈레요.

위에 끝나면 추가하기

■ 이동, 전투, 야영 시 도트 이미로 표현하기
■ 로그인,

■ 아이템 가방 관리

■ 저장한 부분부터 시작(슬롯 5개, 플레이어 상태, 스테이지 저장)

■ 지난번 기록부터 다시 시작( 최근 플레이한 새 스테이지 로드 될 때 마다 플레이어 현재 상태 저장)

■ 죽으면 (1.저장위치에서 다시 시작 2. 마지막 스테이지에서 다시 플레이(포만감, HP 5% 증가, 스테이지 넘버는 유지,다시 랜덤 이벤트 생성) 3. 종료)

진행할 과제 1

◆이벤트 안에 이벤트 추가하기

스터디를 진행할 과제를 링크해주세요. 참고 링크도요

과제에서 필수 사용되는 문법 요약

◆ ' nextEvent: '로 소환할 이벤트가 소환하는 코드 전에 있어야 합니다. 참조되기 전에 초기화(정의)되지 않으면 오류가 발생합니다.

게임 이벤트에서 `nextEvent` 속성의 사용법과 동작 방식.

1. `nextEvent`의 기능
`nextEvent` 속성은 특정 이벤트가 완료된 후 자동으로 이어질 다음 이벤트를 지정하는 기능을 합니다. 이를 통해 플레이어가 선택한 이벤트가 종료되면 다음 이벤트가 즉시 이어질 수 있도록 연결할 수 있습니다. 게임에서는 특정 이벤트 후 이어질 이벤트를 설정함으로써, 게임 스토리나 플로우를 자연스럽게 이어가도록 구성할 수 있습니다.
예시)

{
  description: '장작을 모두 모았습니다! 체력이 감소했습니다.',
  effects: [{ action: 'decreaseStat', stat: 'hp', amount: 15 }],
  nextEvent: campfoodEvent, // 다음 이벤트로 campfoodEvent 설정
}

/////////캠핑////////////
function createCampingEvent() {
  const campfoodEvent = new Event(
    /*생략*/
  );

  const campfireEvent = new Event(
    '밤이 되었습니다. 캠프파이어를 시작하시겠습니까?',
    ['장작을 모으러 가기', '불을 피우지 않기 (행복 -20)'],
    [
      {
        description: '장작을 모두 모았습니다! 체력이 감소했습니다.',
        effects: [{ action: 'decreaseStat', stat: 'hp', amount: 15 }],
        nextEvent: campfoodEvent, // 다음 이벤트로 campfoodEvent 설정
      },
      {
        description: '캠프파이어를 피우지 않고 밤을 보냅니다. 행복도가 감소했습니다.',
        effects: [{ action: 'decreaseStat', stat: 'happiness', amount: 20 }],
        nextEvent: campfoodEvent,
      },
    ],
  );

  return campfireEvent;
}


export async function startGame() {
  const player = new Player();
  let stage = 1;

  // 스테이지 30
  while (player.hp > 0 && stage <= 30) {
    /*생략*/

    // 캠핑 or 스테이지
    if (stage % 10 === 0) {
      const event = createCampingEvent();
      event.trigger(player); // trigger
    } else {
      const event = createRandomEvent();
      event.trigger(player);
    }

2. 동작 방식
  1. 이벤트가 `trigger()` 메서드를 통해 실행됩니다.
  2. `trigger()` 메서드 내에서 `nextEvent`가 있는지 확인하고, 존재하면 `nextEvent`를 이어서 호출하여 플레이어가 다음 이벤트로 자연스럽게 진행하게 합니다.
    여기에서 trigger는 'event.trigger(player);'

3. 정리
`nextEvent`를 활용함으로써 하나의 이벤트 완료 시 연속적으로 이어지는 이벤트를 자동으로 발생시킬 수 있으며, 이를 통해 게임 내 이벤트 흐름을 매끄럽고 직관적으로 관리할 수 있습니다.

◆ 랜덤으로 정수 값 생성하기

▷ getRandomInt(숫자) 0~숫자 의 정수를 랜덤으로 받습니다.

▷ Math.random() 0~1 사이의 실수를 랜덤으로 반환( 1 미포함)

▷ Math.random() 함수는 0~1 사이의 실수를 리턴합니다.(1 미포함)

▷ Math.floor() 함수는 소수점 1번째 자리를 버림하여 정수를 리턴

▷ 범위 지정하여 난수 생성 함수 만들기

min <= number <= max ( max 값 포함)

// min <= number <= max ( max 값 포함)
function rand(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

console.log(rand(1, 3)); // 1~3 사이의 실수
console.log(rand(77, 88)); // 77~88 사이의 실수

// min <= number < max (max 값 불포함)

// min <= number < max (max 값 불포함)
function rand(min, max) {
  return Math.floor(Math.random() * (max - min)) + min;
}

document.writeln(rand(1, 3)); // 1~3 사이의 실수(3 불포함)
document.writeln(rand(77, 88)); // 77~88 사이의 실수(88 불포함)

▷ Math.ceil(실수) : 입력받은 숫자를 올림한 정수를 리턴
Math.ceil() 함수를 이용해서 소수점 아래에서 값을 올림하고 싶을 때는
   처리하려는 숫자의 부동소수점을 올림하고 싶은 숫자 앞까지 옮겨준 후
      (10, 100, 1000... 숫자를 곱하여)
   Math.ceil() 함수를 적용하고 다시 소수점의 위치를 원복시킵니다.
      (10, 100, 1000.. 숫자로 나누어서)

반대로, 10단위, 100단위에서 올림을 처리하고 싶은 경우에는
   마찬가지로 숫자의 부동소수점을 올림하고 싶은 숫자 앞까지 옮겨준 후
      (올림하고 싶은 숫자가 10, 100의 단위이므로 해당 숫자로 나누어 줍니다.)
   Math.ceil() 함수를 적용하고 다시 소수점의 위치를 원복시킵니다.
      (10, 100.. 숫자로 다시 곱해줍니다.)

▷ Math.floor(n) : 입력받은 숫자를 내림한 정수를 리턴(음수 포함)

console.log(Math.floor(null)); // 0
console.log(Math.floor(0)); // 0
console.log(Math.floor(-1.111)); // -2

▷ Math.round(n) : 파라미터로 입력받은 숫자의 소수점 이하의 값이 0.5와 같거나 그보다 크면, 입력받은 수보다 다음으로 높은 절대값을 가지는 정수를 리턴합니다.
0.5보다 작으면, 입력받은 수보다 절대값이 더 낮은 정수를 리턴합니다.

음수의 경우
console.log(Math.round(-1.111)); // -1
console.log(Math.round(-1.5)); // -1
console.log(Math.round(-1.777)); // -2

▷ Number.EPSILON : Javascript에서 오차없이 나타낼수 있는 가장 작은 양의 수로 부동 소수점 오차 보정시 사용합니다.
// 부동소수점 오차 보정 (1.005 반올림)
const n2 = (1.005 + Number.EPSILON) * 100; // 100.50000000000001
const round_2 = Math.round((1.005 + Number.EPSILON) * 100) / 100;

▷ toFixed() 함수는, 부동소수점(Floating Point) 숫자를 고정소수점(Fixed Point) 숫자로 바꾸어서 리턴합니다.
numObj.toFixed([digits])
이 때, 파라미터로 숫자(digits)를 전달하면, 'digits'만큼의 소수점 이하 자리수를 가지는 문자열로 리턴해줍니다.
그리고 이때, 원본 숫자(numObj)의 소수점 이하 길이가 'digits'보다 길면 숫자를 반올림하고, 짧으면 뒤를 0으로 채워서 리턴합니다.

const fixed_1 = 1.222.toFixed(1); // 1.2
const fixed_3 = 1.777.toFixed(1); // 1.8
// 2.음수
const fixed_4 = (-1.222).toFixed(1); // -1.2
const fixed_5 = (-1.5).toFixed(1); // -1.5
const fixed_6 = (-1.777).toFixed(1); // -1.8

▷ toPrecision() 함수는 숫자(numObj)를 파라미터로 전달된 유효 자릿수(precision) 길이의 문자열로 만들어서 리턴합니다.
numObj.toPrecision([precision])
만약, 유효 자릿수(precision)이 원본 숫자의 자릿수보다 작으면 반올림한 값을 리턴합니다

// 1.소수점이하
const precision_1 = 1.222.toPrecision(2); // 1.2
const precision_2 = 1.5.toPrecision(2); // 1.5
const precision_3 = 1.777.toPrecision(2); // 1.8

// 2.음수
const precision_4 = (-1.222).toPrecision(2); // -1.2
const precision_5 = (-1.5).toPrecision(2); // -1.5
const precision_6 = (-1.777).toPrecision(2); // -1.8