자바스크립트는 프로토타입 기반 언어로, 상속을 구현하기 위해 프로토타입 체인을 사용합니다. 이를 이해하는 것은 자바스크립트를 잘 다루기 위한 중요한 개념입니다.
프로토타입
프로토타입은 객체 간에 공유되는 속성과 메서드의 컨테이너입니다. 객체는 자신의 프로토타입을 기반으로 속성과 메서드를 상속받습니다. 즉, 프로토타입을 이용하여 객체 간에 상속 관계를 형성할 수 있습니다.
프로토타입은 prototype이라는 속성을 통해 정의됩니다. 예를 들어, 다음과 같이 Person이라는 생성자 함수와 유사한 객체를 정의할 수 있습니다.
var personPrototype = {
sayHello: function() {
console.log("안녕하세요!");
}
};
이제 Person 생성자 함수를 통해 객체를 생성하고, 프로토타입을 상속받도록 설정해 보겠습니다.
function Person(name) {
this.name = name;
}
Person.prototype = personPrototype;
var person1 = new Person("홍길동");
person1.sayHello(); // "안녕하세요!"
person1 객체는 Person 생성자 함수로 생성된 것이지만, personPrototype을 프로토타입으로 상속받았기 때문에 sayHello 메서드를 사용할 수 있습니다.
상속
자바스크립트는 프로토타입 체인을 통해 상속을 구현합니다. 자식 객체는 부모 객체의 프로토타입을 상속받아 부모 객체의 속성과 메서드를 사용할 수 있습니다.
function Teacher(name, subject) {
Person.call(this, name); // 부모 객체의 생성자 호출
this.subject = subject;
}
Teacher.prototype = Object.create(Person.prototype);
Teacher.prototype.constructor = Teacher;
위 예제에서 Teacher 생성자 함수는 Person 생성자 함수를 호출하여 부모 객체의 속성을 초기화합니다. 그리고 Object.create 메서드를 사용하여 Person.prototype을 상속받은 프로토타입 체인을 만듭니다. 마지막으로 constructor 속성을 Teacher로 설정하여 정확한 생성자를 가리킵니다.
var teacher1 = new Teacher("김선생", "수학");
console.log(teacher1.name); // "김선생"
console.log(teacher1.subject); // "수학"
teacher1.sayHello(); // "안녕하세요!"
teacher1 객체는 Teacher 생성자 함수로 생성되었지만, Person의 프로토타입 체인을 따라 sayHello 메서드를 상속받아 사용할 수 있습니다.
결론
자바스크립트의 프로토타입과 상속은 객체 간의 속성과 메서드를 공유하고 재사용하기 위한 강력한 기능입니다. 이를 통해 코드의 유지보수성과 확장성을 높일 수 있습니다. 프로토타입과 상속 개념을 잘 이해하고 활용하여 자바스크립트 프로그래밍을 하면 좀 더 효율적이고 강력한 코드를 작성할 수 있을 것입니다.