2024년 10월 11일 TIL

오늘은 기존 튜터님이 주신 

monster.js 파일의

class Monster가 서버가 제공한 메타 데이터를

바탕으로 Monster의 정보를 사용할 수 있게 수정해줬다.

 

  constructor(path, monsterData, monsterImages, level) {

    // 생성자 안에서 몬스터의 속성을 정의한다고 생각하시면 됩니다!

    if (!path || path.length <= 0) {

      throw new Error('몬스터가 이동할 경로가 필요합니다.');

    }

    this.monsterNumber = Math.floor(Math.random() * monsterData.length);

    this.monsterInfo = monsterData[this.monsterNumber];

    this.path = path; // 몬스터가 이동할 경로

    this.currentIndex = 0; // 몬스터가 이동 중인 경로의 인덱스

    this.x = path[0].x; // 몬스터의 x 좌표 (최초 위치는 경로의 첫 번째 지점)

    this.y = path[0].y; // 몬스터의 y 좌표 (최초 위치는 경로의 첫 번째 지점)

    this.width = this.monsterInfo.width; // 몬스터 이미지 가로 길이

    this.height = this.monsterInfo.heigth; // 몬스터 이미지 세로 길이

    this.speed = 2; // 몬스터의 이동 속도

    this.image = monsterImages[this.monsterNumber]; // 몬스터 이미지

    this.level = level; // 몬스터 레벨

    this.init(level);

  }

 

생성자로부터 path(몬스터의 이동 경로), Data에서 가져온 몬스터의 데이터들, 몬스터의 이미지파일, level을 받아주고

 

Class의 필드로

 

this.monsterNumber은 monsterData의 길이로 0 ~ length - 1 만큼 랜덤 값이 생성될 수 있게해줬다.

이 값을 바탕으로,

 

this.monsterInfo = monsterData[this.monsterNumber]

을 찾는데 "monsterData[this.monsterNumber].원하는데이터"  방식으로 사용하지 않고,

 

this.monsterInfo을 만들어준 이유는 

 

monster.js 외부 파일에서

 

const monster = new Monster()

로 객체를 생성했을 때, monster.메서드()로

 

this.메서드에서 사용할 필드 = monsterData[this.monsterNumber].제공할정보

를 할 경우

 

메서드는 monsterData를 모르기 때문에 undefined 오류가 발생하기 때문에

this.monsterInfo로 monsterData[this.monsterNumber]

을 필드에 저장시켜야 했다.

 

ex)

  init(level) {

    console.log('이미지 크기 : ', this.width, ', ', this.height);

    console.log('this.monsterNumber : ', this.monsterNumber);

    console.log('monsterData', this.monsterInfo);

    console.log('monsterMaxHp : ', this.monsterInfo.maxHp);

    console.log('level : ', level);

    this.maxHp = this.monsterInfo.maxHp + 10 * level; // 몬스터의 현재 HP

    this.hp = this.maxHp; // 몬스터의 현재 HP

    this.attackPower = this.monsterInfo.attackPower + 5 * level; // 몬스터의 공격력 (기지에 가해지는 데미지)

  }

 

maxHp가 monsterData[this.monsterNumber].maxHp로 

maxHp에게 값을 할당할 경우 오류가 발생했다