BeesBeesBees

BeesBeesBees

 

가장 고귀한 곤충인 꿀벌은, 일생동안 특정 발달 단계를 하나하나 거칩니다.

각 단계에는 꿀벌이 갖는 고유한 특징과 작동이 있습니다.

이 repository에는 다양한 종류의 꿀벌 Class가 존재합니다.

각 단계별로 꿀벌 Class가 있고, 이를 통해 pseudoclassical 패턴 및 ES6 class keyword를 이용한 상속을 배우게 됩니다. (상속은 종종 subclassing 이라고 표현합니다) 어떻게 꿀벌 클래스를 만들어야하는지는 아래 내용을 참고하세요!

 

BeesBeesBees의 목적

Inheritance Implementation , ES6, Pseudoclassical keywords 를 이용한 상속구현

 

시작전 다음과 같은 것을 확인해야 했다.

npm install을 통해 dependency를 설치하세요. -> 말 그래도 일단 터미널에서 npm install dependency를 작성하여 설치가 된걸 볼 수 있었다. src 디렉토리 안에는 es6, pseudoclassical이라는 디렉토리가 존재합니다. 각각 디렉토리에 해당하는 패턴으로 구현하세요. pseudoclassical한 방법으로는, prototype, constructor 키워드를 이용합니다. ES6 방법으로는, super, extends, class 키워드를 이용합니다. 각각의 클래스마다 여러개의 테스트가 작성되어 있지만, 테스트는 순차적으로 진행됩니다. 따라서 작성된 순서대로 테스트를 진행하셔야 합니다. 현재 테스트가 통과해야 그 다음 테스트를 진행 할 수 있습니다. Grub.js 파일부터 작성을 시작하세요. Grub은 다른 모든 Bee의 기반이 될 것입니다. 모든 Bee에 대한 구현이 끝나셨다면, /test에 작성되어있는 모든 Bee에 대한 요구사항이 전부 만족하였는지 테스트를 통해 확인해 보세요. npm test를 통해 테스트를 진행할 수 있습니다.

 

Class Structure

 

├── Grub │

           └── Bee │

                     ├── HoneyMakerBee │

                     └── ForagerBee

 

위의 class structure에서 볼 수 있듯이 모든 Bee는 Grub을 기반으로 하여 각자의 특성에 맞는 일을 받게 됩니다.

공통된 특성을 기반으로 각자에게 맞는 특성을 부여받을 수 있는것은 상속이 이루어졌음을 의미합니다.

 

Grub

• Create a Grub class, in ES6 style, with:
  • an age property that is set to 0 (0으로 설정된 연령 속성)
  • a color property that is set to pink (핑크빛으로 설정된 색채 특성)
  • a food property that is set to jelly ( 젤리처럼 굳어진 식량 재산)
  • an eat method that returns 'Mmmmmmmmm jelly' ( 'Mmmm젤리'를 돌려주는 식사법)

Bee

• Create a Bee class, in ES6 style, with:
  • the Grub superclass ( super 객체 사용 )
  • an age property that is set to 5 ( 5세로 정해진 연령의 재산 )
  • a color property that is set to yellow ( 노란색으로 설정된 색 속성 )
  • a food property that is inherited from grub ( 밭에서 물려받은 식량 재산)
  • an eat method that is inherited from grub ( grub에서 유전되는 식사법 )
  • a job property that is set to Keep on growing ( 계속 성장하기로 되어 있는 직업 재산 )

HoneyMakerBee

• Create a HoneyMakerBee class, in ES6 style, with:
  • the Bee superclass
  • an age property that is set to 10 ( 10로 정해진 연령의 재산 )
  • a job property that is set to make honey ( 꿀을 만들도록 설정된 직업 재산 )
  • a color property inherited from bee that is set to yellow ( 벌로부터 물려받은 누런 색의 성질 )
  • a food property that is inherited from grub ( 밭에서 물려받은 식량 재산 )
  • an eat method that is inherited from grub ( grub에서 유전되는 식사법 )
  • a honeyPot property that is set to 0 ( 0으로 설정된 honeypot 속성 )
  • a makeHoney method that adds 1 to that honeyBee's honeyPot ( 그 꿀벌에 honeypot에 1을 더하는 makeHoney 방법 )
  • a giveHoney method that subtracts 1 from that honeyBee's honeyPot ( 1을 빼는 honey method )

ForagerBee

• Create a ForagerBee class, in ES6 style, with:
  • the Bee superclass
  • an age property that is set to 10 ( 10세로 정해진 연령의 재산 )
  • a job property that is set to find pollen ( 꽃가루를 찾기 위해 마련된 직업 재산 )
  • a color property inherited from bee that is set to yellow ( 벌로부터 물려받은 누런 색의 성질 )
  • a food property that is inherited from grub ( 밭에서 물려받은 식량 재산 )
  • an eat method that is inherited from grub ( grub에서 유전되는 식사법 )
  • a canFly property that is set true ( 참으로 설정된 canFly 속성 )
  • a treasureChest property that is set to an empty array [] ( 보물빈 배열로 설정된 체스트 속성[] )
  • a forage method that allows the bee to add a treasure to the treasureChest ( 벌이 보물에 보물을 더할 수 있는 포경법 체스트 )

---

 

HTML& CSS - 웹사이트 하나를 그대로 클론해보기

 

Subclass Dance Party

 

Event handling, UI , Inheritance, Object Interaction

 

상속을 통해 구현한 객체를 직접 화면 표시하고 각자 화면에 이벤트를 걸어 화면에 표현해보자.

선배들이 한거 디아블로 사냥, 배틀그라운드 사냥