프로토타입 prototype 패턴 - 자바스크립트 예제
SW설계디자인패턴
읽는데 3분 소요
처음 쓰여진 날: 2025-09-02
마지막 수정일: 2025-09-02
조회수: 303
요약
프로토타입 prototype 패턴을 자바스크립트 코드와 함께 알아봅니다.
프로토타입 (Prototype) 패턴 요약
| 패턴 종류 | 핵심 키워드 |
|---|---|
| 프로토타입 (Prototype) | 기존 객체를 복제하여 새로운 객체를 생성 |

프로토타입 (Prototype) 패턴
프로토타입 패턴은 기존 객체를 복제하여 새로운 객체를 생성하는 디자인 패턴입니다. new 키워드를 사용하여 클래스로부터 객체를 만드는 대신, 원본(prototype) 객체를 복사하여 필요한 부분을 수정한 뒤 사용하는 방식입니다. 특히 객체 생성 비용이 비싸거나, 클래스로부터 객체를 만드는 과정이 복잡할 때 유용합니다.
자바스크립트는 프로토타입 기반 언어이기 때문에 이 패턴을 매우 자연스럽게 활용할 수 있습니다.
기본 구조
게임 캐릭터를 생성하는 예시를 통해 알아보겠습니다. 모든 캐릭터는 기본 능력치(체력, 공격력)를 공유하지만, 각자 다른 이름과 직업을 가질 수 있습니다.
javascript
코드 하이라이팅 중...
Object.create()는 지정된 프로토타입 객체를 사용하여 새 객체를 만듭니다. 이렇게 생성된 객체는 원본의 속성과 메서드를 상속받으면서, 자신만의 고유한 상태를 가질 수 있습니다.
언제 필요할까?
- 객체 생성 비용이 클 때: 데이터베이스에서 무거운 데이터를 조회하여 객체를 만들어야 할 경우, 매번 생성하는 대신 한 번 만든 객체를 복제하여 사용하면 성능상 이점을 얻을 수 있습니다.
- 다양한 종류의 객체를 생성해야 할 때: 팩토리 메서드 패턴처럼 하위 클래스를 많이 만들지 않고도, 프로토타입 객체 몇 개만으로 다양한 변형 객체를 쉽게 만들 수 있습니다.
자바스크립트에서는 Object.create()나 전개 구문({...original, ...overrides})을 통해 프로토타입 패턴을 간단하게 구현할 수 있습니다.
프로토타입 패턴 중요 키워드
- 원본 객체를 복제하여 새 객체를 생성한다.
new키워드 없이 객체를 만들 수 있다.- 객체 생성 비용이 비쌀 때 효과적이다.