자바스크립트에서 생성자 함수가 무엇인지, class 문법은 왜 도입되었는지 설명해주세요.
분야: 프론트엔드
생성자 함수가 무엇인가요?
자바스크립트에서 생성자 함수는 객체를 생성하는 하나의 방법입니다. 일반적으로 function 키워드를 사용하여 정의하며, new 키워드와 함께 호출할 경우 새로운 객체가 만들어집니다. 생성자 함수 내부에서 this 키워드는 새롭게 생성된 객체를 가리키며, 여기에 속성을 추가하면 해당 객체에 저장됩니다.
예를 들어, 다음과 같은 방식으로 생성자 함수를 사용할 수 있습니다.
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype.greet = function() {
console.log(`안녕하세요, 저는 ${this.name}입니다.`);
};
const person1 = new Person('Alice', 25);
class 문법은 왜 도입되었나요? 🤔
생성자 함수는 유지보수성이 떨어진다는 문제가 있습니다. 우선, 명확한 클래스 개념이 없기 때문에 상속을 구현할 때 프로토타입 체인을 이용해야 하는데, 이는 가독성이 좋지 않습니다. 다른 객체지향 언어와 형태가 많이 다르기 때문에 이해하기 비교적 어렵기도 합니다. 또한 new 키워드 없이 일반 함수처럼 호출될 수도 있어 혼동을 유발합니다.
이러한 단점을 극복하기 위해 class 문법이 등장했습니다. class를 사용하면 객체를 생성하는 코드를 더욱 직관적으로 작성할 수 있습니다. 예시와 함께 설명드리겠습니다.
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
greet() {
console.log(`안녕하세요, 저는 ${this.name}입니다.`);
}
}
const person2 = new Person('Bob', 30);
이처럼 class를 사용하면 생성자와 메서드를 명확하게 정의할 수 있습니다. 또한 다른 객체지향 언어의 문법과 유사한 형태여서 이해하기 쉽습니다. extends, super를 이용하여 상속을 간결하게 구현할 수 있고, static, getter/setter 등 객체지향 관련 키워드를 지원하기도 합니다. 또한, 생성자 함수와 달리 일반 함수처럼 호출할 수 없도록 하는 제약이 추가됩니다.