클래스 (2)

프로퍼티 

인스턴스 프로퍼티 

constructor 내부 코드가 실행되기 이전에 constructor 내부의 this에는 이미 빈 객체가 바인딩 되어있다. constructor 내부에서 this 인스턴스 프로퍼티를 추가함으로써 클래스가 생성한 빈 객체, 즉 인스턴스에 프로퍼티가 추가되어 인스턴스가 초기화 된다. 

 

접근자 프로퍼티 

접근자 프로퍼티는 클래스에서도 사용할 수 있다. 접근자 프로퍼티는 자체적으로 는 값을 갖지 않고 다른 데이터 프로퍼티의 값을 읽거나 저장할 때 사용하는 접근자 함수 ( getter , setter ) 로 구성되어 있다. 

getter와 setter 이름은 인스턴스 프로퍼티처럼 사용된다. getter는 호출하는 것이 아니라 프로퍼티처럼 참조하는 형식으로 사용한다. 

getter는 반드시 무언가를 반환해야 하고 setter는 반드시 하나의 매개변수가 있어야 한다. 

클래스의 메서드가 기본적으로 프로토타입 메서드가 되는것처럼, 클래스의 접근자 프로퍼티도 프로토타입의 프로퍼티가 된다. 

 

클래스 필드 

이제 자바스크립트에서도 클래스 내부에 필드 사용이 가능하다. body 최상단에 선언할수 있으며, private 필드는 필드명 앞에 #을 붙여서 선언할 수 있다. 

클래스 몸체에서 클래스 필드를 정의하는 경우 this에 클래스 필드를 바인딩해서는 안된다.  

인스턴스를 생성할 때 외부의 초기값으로 클래스 필드를 초기화해야한다면 constructor 에서 클래스 필드를 초기화 해야 한다.

 

인스턴스를 생성할 때 외부의 초기값으로 클래스 필드를 초기화해야한다면 constructor 에서 클래스 필드를 초기화 해야 한다.

 

 

 

이처럼 인스턴스를 생성할때 클래스 필드를 초기화 해야하면 constructor 밖에서 클래스 필드를 정의할 필요가 없다. this에 클래스 필드에 해당하는 프로퍼티가 없다면 자동 추가되기 때문이다. 

 

 

 

 

함수는 일급 객체 이므로 함수를 클래스 필드에 할당할 수 있다. 

필드에 함수를 할당하는 경우, 이 함수는 프로토타입 메서드가 아닌 인스턴스 메서드가 된다. 모든 클래스 필드는 인스턴스 프로퍼티가 되기때문이다. 따라서 클래스 필드에 함수를 할당한느 것은 권장하지 않는다. 

(클래스 필드에 화살표 함수를 할당하여 화살표 함수 내부의 this가 인스턴스를 가리키게 한느 경우도 있다.) 

 

 

tc39 finished (https://github.com/tc39/proposal-class-fields) 

 

 

 

 

 

 

 

 

 

 

참고 - 모던 자바스크립트 Deep Dive