We're looking for a person or people to help audit MDN to find places we could speed up. Is this you or someone you know? Check out the RFP: https://mzl.la/2IHcMiE

생성자 메소드는 클레스가 오브젝트로 생성되고 초기되기 위한 특별한 메소드 입니다.


constructor([arguments]) { ... }


클래스에는 "constructor"라는 이름을 가진 특별한 메소드를 하나씩 가질 수 있습니다. 하나 이상의 생성자 메소드가 발견되면 SyntaxError 에러가 발생합니다.

생성자 메서드는 "super" 키워드를 사용하여 상위 클래스의 생성자 메소드를 호출할 수 있습니다.

만약 생성자 메소드를 저장하지 않을 경우, 기본 생성자 메소드가 사용됩니다.


생성자 메소드 사용하기

아래의 코드조각은 classes sample (live demo)에서 발췌하였습니다.

class Square extends Polygon {
  constructor(length) {
    // length로 다각형의 넓이와 높이를 정의하기 위해 부모클래스의 생성자를 호출합니다.
    super(length, length);
    // Note: 파생 클래스에서, 'this'를 사용하기 전에는 반드시 super()를
    // 호출하여야 합니다. 그렇지 않을 경우 참조에러가 발생합니다.
    this.name = 'Square';

  get area() {
    return this.height * this.width;

  set area(value) {
    this.area = value;

기본 생성자

만약 생성자를 지정하지 않을 경우 기본 생성자 메소드가 사용됩니다. 기본적인 클래스의 기본 생성자 메소드는 :

constructor() {}

파생 클래스의 경우, 기본 생성자는 다음과 같습니다. :

constructor(...args) {


명세 상태 설명
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'Constructor Method' in that specification.
Standard Initial definition.
ECMAScript Latest Draft (ECMA-262)
The definition of 'Constructor Method' in that specification.

브라우저 호환성

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 42.0 45 (45) ? ? ?
Default constructors ? 45 (45) ? ? ?
Feature Android Android Webview Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support No support 42.0 45.0 (45) ? ? ? 42.0
Default constructors ? ? 45.0 (45) ? ? ? ?



문서 태그 및 공헌자

 이 페이지의 공헌자: jeonnoej
 최종 변경: jeonnoej,