자바스크립트는 프로토타입 기반으로 동작하는 언어로, 객체를 생성하기 위해 클래스를 정의하는 대신 프로토타입을 사용하여 객체를 생성하고 상속할 수 있습니다. 이번 글에서는 프로토타입을 활용하여 자바스크립트 클래스를 구현하는 방법에 대해 알아보겠습니다.

프로토타입 기반 클래스 생성

자바스크립트에서 클래스를 생성하기 위해 먼저 생성자 함수를 정의합니다. 생성자 함수는 객체를 생성할 때 실행되는 함수로, 해당 클래스의 인스턴스를 초기화하고 속성을 설정하는 역할을 합니다. 예를 들어, Person 클래스의 생성자 함수는 다음과 같이 정의할 수 있습니다.

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

위의 코드에서 Person이라는 생성자 함수를 정의하였습니다. name과 age라는 매개변수를 받아 해당 값을 객체의 속성에 할당하고 있습니다.

프로토타입에 메서드 추가

이후에는 프로토타입을 사용하여 클래스의 메서드를 추가할 수 있습니다. 메서드는 해당 클래스의 모든 인스턴스가 공유하는 함수입니다. 아래 코드는 Person 클래스에 sayHello라는 메서드를 추가하는 예시입니다.

Person.prototype.sayHello = function() {
  console.log('Hello, my name is ' + this.name + '.');
}

위의 코드에서 Person.prototype은 Person 클래스의 프로토타입 객체를 가리킵니다. sayHello 메서드는 console.log를 통해 메시지를 출력하는 함수입니다.

클래스 인스턴스 생성

클래스의 인스턴스를 생성하는 방법은 생성자 함수를 new 키워드와 함께 호출하는 것입니다. 아래 코드는 Person 클래스의 인스턴스를 생성하는 예시입니다.

var person = new Person('John', 25);

위의 코드에서 person 변수는 Person 클래스의 인스턴스를 참조합니다. new Person('John', 25)는 Person 생성자 함수를 호출하여 새로운 Person 인스턴스를 생성하고, name과 age 속성을 세팅하는 코드입니다.

프로토타입 메서드 사용

클래스의 인스턴스를 사용하여 프로토타입에 정의된 메서드를 호출할 수 있습니다. 아래 코드는 person 인스턴스의 sayHello 메서드를 호출하는 예시입니다.

person.sayHello(); // 출력: Hello, my name is John.

위의 코드에서 person.sayHello()는 person 인스턴스의 sayHello 메서드를 호출하는 코드입니다. 이 호출은 Person 클래스의 프로토타입에 정의된 sayHello 메서드를 실행하게 됩니다.

결론

프로토타입을 활용하여 자바스크립트 클래스를 구현하는 방법에 대해 알아보았습니다. 프로토타입 기반으로 동작하는 자바스크립트의 강력한 객체 지향 기능을 활용하여 더 유연하고 재사용 가능한 코드를 작성할 수 있습니다.

#writing #javascript