네, ES6 이전의 JavaScript에서는 주로 함수를 사용하여 클래스와 비슷한 구조를 만들곤 했습니다. 이러한 방식은 주로 생성자 함수와 프로토타입을 이용하여 객체 지향 프로그래밍을 구현합니다. 이러한 패턴을 '프로토타입 기반 상속'이라고 합니다.
생성자 함수 사용 예제
생성자 함수를 사용하여 클래스와 유사하게 객체를 생성하고 메서드를 정의할 수 있습니다. 아래는 생성자 함수와 프로토타입을 이용한 예제입니다.
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype.greet = function() {
console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
};
const john = new Person('John', 30);
john.greet(); // 출력: Hello, my name is John and I am 30 years old.
프로토타입 상속 예제
JavaScript의 모든 함수는 prototype
이라는 속성을 가지고 있으며, 이를 통해 상속을 구현할 수 있습니다.
function Employee(name, age, position) {
Person.call(this, name, age); // 상위 클래스 생성자 호출
this.position = position;
}
// Person의 프로토타입을 상속받기
Employee.prototype = Object.create(Person.prototype);
Employee.prototype.constructor = Employee;
Employee.prototype.work = function() {
console.log(`${this.name} is working as a ${this.position}.`);
};
const jane = new Employee('Jane', 28, 'Engineer');
jane.greet(); // Hello, my name is Jane and I am 28 years old.
jane.work(); // Jane is working as a Engineer.
이러한 방식은 ES6에서 class
키워드를 도입하기 전에 널리 사용되던 패턴으로, 여전히 많은 코드 베이스에서 찾아볼 수 있습니다. class
키워드는 이러한 구문을 더 명확하고 이해하기 쉽게 만들기 위해 도입되었지만, 내부적으로는 프로토타입 기반의 상속을 사용합니다. 따라서 class
를 사용하는 것과 생성자 함수를 사용하는 것 사이에는 기본적인 차이는 없습니다.
'javascript' 카테고리의 다른 글
[240424 TIL] document Fragment (1) | 2024.04.24 |
---|---|
[240423 TIL] 화살표함수, 일반함수에서 this (0) | 2024.04.23 |
...spread (0) | 2024.03.12 |
배열메소드 총정리 (0) | 2024.03.11 |
클로저 보강 (0) | 2024.03.11 |