JavaScript 기초(26)_클래스(1) constructor

1. 클래스 : 객체를 만들 수 있는 새로운 방법

클래스를 만드는 방식은 크게 2가지가 있다.

 

첫 번 째는 선언적 방식이다. 아래의 코드를 참고하자

class A {}

console.log(new A());

[Running] 
A {}

class로 직접 선언하는 방식이며 출력할 때는 'new'를 덧붙여 함수를 호출하듯이 활용하면 된다.

 

두 번 째는 변수에 할당하는 방식이다. 

const B = class {};

console.log(new B());

[Running] 
B {}

변수 B에다가 클래스를 할당하여 위와 같이 출력하였다. 

 

선언적 방식으로 표현이 가능하다면 클래스에는 과연 호이 스팅이 일어날까? 

new C();

class C {}

Running] 
new C();
^

ReferenceError: Cannot access 'C' before initialization

클래스는 호이스팅이 일어나지 않는다.  ES6버전에서 추가된 기능인만큼 호이스팅이 일어나지 않는 방향으로 업데이트되고 있다.

 

2. 생성자(Constructor)

: 클래스에 최초의 초기값을 통해 함수를 활용할 수 있도록 해주는 것이다. 명불허전 아래의 예시를 통해 알아보자.

 

일단, 그냥 클래스 생성이다.

class A {}

console.log(new A());

[Running]
A {}

 

'constructor'를 출력하는 생성자를 아래와 같이 살짝 집어넣어보았다.

class B {
    constructor(){
        console.log('constructor');
    }
}

console.log(new B());

[Running] 
constructor
B {}

 

다음은 생성자에 쓸만한 인자를 추가해보았다.

class C {
    constructor(name, age){
        console.log('constructor', name, age );
    }
}
console.log(new C('Kim', 31));
console.log(new C());

[Running] 
constructor Kim 31
C {}
constructor undefined undefined
C {}

'kim'과 31을 괄호 안에 넣어서 위와 같이 활용할 수 있으며, 

name, age 인자를 설정하였음에도 아무 값도 넣지 않고 출력하면 'undefined'로 출력됨을 알 수 있다.