각각의 Class에 해당하는 기능들을 만들고 조합하는 방법과 코드

박찬정·2024년 6월 23일
0

자바스크립트의 클래스는 ES6(ECMAScript 2015)부터 도입되었습니다.

1. 기본 클래스 정의

사람(Person) 클래스

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  introduce() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

직장인(Employee) 클래스

직장인의 정보를 담는 클래스를 정의합니다. 이 클래스는 사람 클래스를 상속받아 확장합니다.

class Employee extends Person {
  constructor(name, age, employeeId, position) {
    super(name, age);
    this.employeeId = employeeId;
    this.position = position;
  }

  work() {
    console.log(`${this.name} is working as a ${this.position}.`);
  }
}

2. 클래스 조합하기 (Composition)

클래스를 조합하는 또 다른 방법은 하나의 클래스가 다른 클래스를 속성으로 가지도록 하는 것입니다. 예를 들어, 회사(Company) 클래스를 만들어 직원 목록을 관리할 수 있습니다.

class Company {
  constructor(name) {
    this.name = name;
    this.employees = [];
  }

  addEmployee(employee) {
    this.employees.push(employee);
  }

  listEmployees() {
    console.log(`Employees at ${this.name}:`);
    this.employees.forEach(employee => {
      employee.introduce();
      employee.work();
    });
  }
}

3. 클래스 사용 예시

위에서 정의한 클래스를 사용하여 객체를 생성하고, 상호작용하는 방법을 보여드리겠습니다.

// 사람 객체 생성
const person1 = new Person("Alice", 30);
person1.introduce(); // "Hello, my name is Alice and I am 30 years old."

// 직장인 객체 생성
const employee1 = new Employee("Bob", 40, "E123", "Engineer");
employee1.introduce(); // "Hello, my name is Bob and I am 40 years old."
employee1.work(); // "Bob is working as a Engineer."

// 회사 객체 생성 및 직원 추가
const company = new Company("Tech Corp");
company.addEmployee(employee1);
company.listEmployees();
// "Employees at Tech Corp:"
// "Hello, my name is Bob and I am 40 years old."
// "Bob is working as a Engineer."

4. 코드 설명

Person 클래스:

constructor: 이름과 나이를 초기화합니다.
introduce 메소드: 자기소개를 출력합니다.

Employee 클래스:

constructor: 이름, 나이, 직원 ID, 직책을 초기화합니다. 부모 클래스의 constructor를 호출하여 이름과 나이를 초기화합니다.
work 메소드: 직무 정보를 출력합니다.

Company 클래스:

constructor: 회사 이름을 초기화하고, 직원 목록을 빈 배열로 초기화합니다.
addEmployee 메소드: 직원 객체를 직원 목록에 추가합니다.
listEmployees 메소드: 직원 목록을 출력하고, 각 직원의 introduce와 work 메소드를 호출합니다.

이 예제는 자바스크립트에서 클래스 정의와 조합의 기본 개념을 설명합니다. 실제 응용 프로그램에서는 더 복잡한 상호작용과 메소드가 필요할 수 있습니다. 이러한 기본 개념을 잘 이해하면, 객체 지향 프로그래밍을 자바스크립트에서도 효과적으로 활용할 수 있습니다.

profile
프론트엔드 배우고 있습니다

0개의 댓글