JavaScript는 객체 지향 프로그래밍(OOP)을 지원하며, ES6(ECMAScript 2015)에서 클래스 문법이 도입되어 더욱 직관적이고 간편하게 객체 지향 프로그래밍을 구현할 수 있게 되었습니다.
이 글에서는 JavaScript에서 클래스를 사용해 생성자 함수를 만드는 방법과 그 이점을 설명합니다.
1. 클래스 문법의 기본 구조
ES6 클래스는 class 키워드를 사용하여 정의됩니다. 기본적인 클래스 구조는 다음과 같습니다.
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
introduce() {
console.log(`Hello, my name is ${this.name} and I'm ${this.age} years old.`);
}
}
위의 코드는 Person이라는 클래스를 정의하고 있습니다. 이제 각 부분을 자세히 살펴보겠습니다.
2. 생성자 메서드: constructor
클래스에서 constructor 메서드는 클래스의 인스턴스가 생성될 때 호출됩니다.
이 메서드는 객체의 초기 상태를 설정하는 데 사용됩니다.
constructor(name, age) {
this.name = name;
this.age = age;
}
constructor 메서드는 클래스의 인스턴스를 초기화하는 역할을 하며, name과 age 매개변수를 받아 해당 인스턴스의 속성으로 설정합니다.
3. 인스턴스 메서드
클래스 내부에서 정의된 메서드는 자동으로 해당 클래스의 모든 인스턴스가 공유하는 프로토타입 메서드가 됩니다.
예를 들어, introduce 메서드는 모든 Person 인스턴스가 사용할 수 있습니다.
introduce() {
console.log(`Hello, my name is ${this.name} and I'm ${this.age} years old.`);
}
이 메서드는 인스턴스의 name과 age 속성을 이용해 자기 소개 메시지를 출력합니다.
4. 클래스 인스턴스 생성
클래스의 인스턴스를 생성하려면 new 키워드를 사용합니다.
const person1 = new Person('John', 30);
person1.introduce(); // Hello, my name is John and I'm 30 years old.
위 코드는 Person 클래스의 새로운 인스턴스를 생성하고, introduce 메서드를 호출하여 결과를 출력합니다.
5. 상속
클래스를 사용하면 상속을 통해 코드 재사용성을 높일 수 있습니다. extends 키워드를 사용하여 상속할 수 있습니다.
class Employee extends Person {
constructor(name, age, jobTitle) {
super(name, age);
this.jobTitle = jobTitle;
}
introduce() {
super.introduce();
console.log(`I work as a ${this.jobTitle}.`);
}
}
위 코드는 Person 클래스를 상속받아 Employee 클래스를 정의합니다. super 키워드를 사용하여 부모 클래스의 constructor와 introduce 메서드를 호출합니다.
const employee1 = new Employee('Jane', 28, 'Software Engineer');
employee1.introduce();
// Hello, my name is Jane and I'm 28 years old.
// I work as a Software Engineer.
6. 클래스의 장점
- 가독성: 클래스 문법은 객체 지향 개념을 직관적으로 표현하여 코드의 가독성을 높입니다.
- 구조화: 클래스는 관련된 속성과 메서드를 하나의 구조로 묶어 코드의 구조화와 유지보수성을 개선합니다.
- 상속 및 재사용: 상속을 통해 코드 재사용성을 높이고, 중복 코드를 줄일 수 있습니다.
- 프로토타입 처리의 간소화: 메서드를 프로토타입에 추가하는 과정을 자동으로 처리하여 개발자의 부담을 줄입니다.
결론
ES6 클래스 문법을 사용하면 JavaScript에서 객체 지향 프로그래밍을 보다 직관적이고 간편하게 구현할 수 있습니다. 생성자 함수와 인스턴스 메서드를 정의하고, 상속을 통해 코드 재사용성을 높이는 등의 장점을 활용해 더 나은 JavaScript 코드를 작성해 보세요.