과제] Unit 2. 객체지향프로그래밍(beesbeesbees)

SEB_FE_45

Section 2. Unit 2. 객체지향 프로그래밍 과제 beesbeesbees

---

✅ 과제에서 학습해야 할 개념

• 클래스, 인스턴스, 프로토타입
• this 키워드
• 클래스 생성자(constructor)
• 상속(extends, super 키워드)

---

1️⃣클래스와 인스턴스

• 클래스 : 특정 객체를 표현하기 위한 객체의 구조(틀 또는 템플릿)이며, 객체 내 속성과 메서드를 정의하는 역할을 하며, 클래스는 함수이다.
  • 클래스의 코드 구조는 아래와 같다.

class 클래스 () {
  method1 () {
    prop1
    prop2
    ...
  }
  method1 () {...}
  method1 () {...}
   .
   .
   .
}
//클래스 - 메서드 묶음, 메서드 - 속성 묶음

• 인스턴스 : 클래스 구조에 데이터 값을 입력한 객체
• 프로토타입 : 클래스 객체의 구조(속성과 메서드)를 상속받은 객체이며, 속성과 메서드를 지닌 부모 객체이다.

2023.05.11 - [SEB_FE_45(코드스테이츠)/section 2.] - TIL] Unit 2. 객체지향프로그래밍(프로토타입과 클래스)

TIL] Unit 2. 객체지향프로그래밍(프로토타입과 클래스)

 

2️⃣this 키워드

• 생성자 함수가 생성할 인스턴스(instance)를 가리킨다.

 

3️⃣클래스 생성자 메서드(constructor)

• 인스턴스를 생성하고 초기화하기 위한 메서드이다.
• 객체의 기본 상태를 설정해주는 메서드이다.
• new 생성자 함수에 의해 자동으로 호출되므로, 특별한 절차 없이 객체 초기화할 수 있다.

 

4️⃣클래스 상속

• 상속 : 클래스의 속성과 메서드를 인스턴스가 상속해서 사용할 수 있다. 상속받은 클래스(자식)를 서브클래스, 상속된 클래스(부모)를 슈퍼 클래스라고 한다. 
• extends 키워드 : 상속을 통한 클래스 확장 시 필요하며, 상속받을 클래스를 정의한다. 프로토타입을 기반으로 동작한다. 클래스 문법은 키워드 뒤에 표현식이 와도 처리해준다.
• super 키워드 : 함수처럼 호출할 수도 있고, this와 같이 식별자 처럼 참조할 수 있는 키워드다. 

---

✅beesbeesbees 과제

1. Grub class

• constructor 메서드로 age, color, food 속성을 감싸도 되고, 그렇지 않아도 작동에는 이상이 없다.
• Grub.prototype 은 constructor : class Grub 과 eat 이다.

2. Bee class

• Grub 클래스의 메서드와 속성을 상속받는다. 이에 extends 키워드를 사용하였다.
• extends는 Bee.prototype.[[Prototype]] 을 Grub.prototype 으로 설정한다.

• constructor 키워드가 없으면, SyntaxError: Unexpected identifier가 발생한다.

3. ForagerBee

• Bee 클래스를 상속받는다. Bee 클래스도 서브클래스이기 때문에 최상위 클래스인 Grub도 상속받는다.
• ForagerBee.prototype는 Bee 클래스이며, ForagerBee.prototype.[[Prototype]]은 Grub클래스이다.

4. HoneyMakerBee

• Bee 클래스를 상속받는다. Bee 클래스도 서브클래스이기 때문에 최상위 클래스인 Grub도 상속받는다.
• HoneyMakerBee.prototype는 Bee 클래스이며, HoneyMakerBee.prototype.[[Prototype]]은 Grub클래스이다.
• ForagerBee 클래스와 HoneyMakerBee클래스는 같은 상위 클래스를 상속하지만, 별개의 클래스이다.

---

💪회고

섹션2 처음 시작할 때는 이게 뭔소린가 싶었는데, 어떻게 코드를 작성해야 하는지 감이 조금은 왔다.

클래스와 인스턴스, 프로토타입 등 아직 개념이 머리속에 딱! 정립이 되지는 않지만, 딥다이브와 같은 레퍼런스를 참고해서 추가적으로 공부를 진행해보고자 한다.

단, 오전 포스팅에서도 언급한바 있는데, 예제 코드만 쳐보고 하는 것에는 한계가 있는 것 같다.

이에 주말에는 무조건 작은 기능 하나라도 만들어보면서 부족한 개념을 익혀보도록 하겠다!

(이 과제 때문에 진짜 심각하게 스트레스 받았었는데, 이렇게 술술 풀리다니!! 내가 조금은 성장했구나 싶다! 노력하자!)

 

참조 : https://ko.javascript.info/class

클래스와 기본 문법