[코어자바스크립트] 클래스

자바스크립트는 프로토타입 기반 언어라서 상속 개념이 존재하지 않는다. 

그러나 개발자들은 클래스 기반의 언어에 익숙하고, 

이러한 니즈에 따라 결국 ES6에는 클래스 문법이 추가되었다.

 

클래스와 인스턴스의 개념 이해

가령 '음식'은 직접 만질 수도 볼 수도 없는 추상적인 개념이다.

반면 '과일', '채소'등은 직접 만질 수 있는 실존하는 사물이다.

또한 음식은 과일, 채소 등의 관계에서 상위의 개념이고, 과일 등은 하위의 개념이다.

 

과일, 음식은 모두 클래스이다.

음식은 과일보다 상위클래스superClass이며, 과일은 음식보다 하위클래스subclass이다.

과일 안에도 귤류 등의 하위 클래스들이 존재할 수 있다. 

 

하위 개념은 상위 개념을 포함하면서 더 구체적인 개념이 추가되는 것이다. 

음식 클래스가 '먹을 수 있다'정도이면

과일 클래스는 '먹을 수 있다' + '나무에서 열린다' 정도가 될 것이다. 

 

어떤 클래스의 속성을 지니는 실존하는 개체를 일컬어 인스턴스라고 한다. 

 

하나의 개체는 같은 레벨에 있는 여러 다른 클래스의 인스턴스이다.

여자 + 직장인 + 한국인 이라는 별개의 분류체계가 합쳐짐에 따라 다양한 클래스가 생성된다. 

 

컴퓨터는 위와 같은 구분법을 모르므로 사용자가 직접 여러 가지 클래스를 정의해야 한다.

클래스를 바탕으로 인스턴스를 만들 때, 비로소 어떤 개체가 클래스의 속성을 지니게 된다. 

또한 인스턴스는 하나의 클래스만을 바탕으로 만들어진다. 

어떤 인스턴스가 다양한 클래스에 속할 수 있지만 이 클래스들은 모두 인스턴스 입장에서는 직계존속이다.

인스턴스를 생성할 때 호출할 수 있는 클래스는 오직 하나일 뿐이기 때문이다.

 

즉 실제 세상과 달리, 프로그래밍 언어는 클래스가 먼저 정의되어야만 그로부터 공통적인 요소를 지니는 개체들을 생성할 수 있다. 

 

자바스크립트의 클래스

자바스크립트는 프로토타입 기반 언어이므로 클래스의 개념이 존재하지 않는다.

그러나 프로토타입을 일반적인 의미에서의 클래스 관점에서 접근해보면 비슷하게 해석할 수 있다. 

 

생성자 함수 Array를 new연산자와 함께 호출하면 인스턴스가 생성된다.

이때 Array를 일종의 클래스라고 하면, Array의 프로토타입 객체 내부 요소들이 인스턴스에 상속된다고 볼 수 있다.

(엄밀히 말하면 상속이 아닌 프로토타입 체이닝에 의한 참조이다)

Array 내부 프로퍼티들 중 prototype 프로퍼티를 제외한 나머지는 인스턴스에 상속되지 않는다. 

 

인스턴스에 상속되는지 여부에 따라 static member와 instance member로 나뉜다. 

이 분류는 다른 클래스 입장에서 사용 대상에 따라 구분한 것이다. 

그러나 자바스크립트는 인스턴스에서도 직접 메서드를 정의할 수 있기 때문에 인스턴스 메서드라는 명칭은 프로토타입에 정의한 메서드를 지칭하는 것인지 인스턴스에 정의한 메서드를 지칭하는 것인지에 대해 도리어 혼란을 야기한다. 따라서 프로토타입 메서드라고 부르는 편이 더 좋을 것이다. 

 

클래스 상속

클래스 상속은 객체지향에서 중요한 요소 중 하나이다. 

ES5까지의 자바스크립트에는 클래스가 없었다. 

자바스크립트에서 클래스 상속을 구현했다는 것은 결국 프로토타입 체이닝을 잘 연결한 것으로 이해하면 된다. 

 

정리

자바스크립트는 프로토타입 기반 언어이기 때문에 클래스 및 상속 개념은 존재하지 않지만,

프로토타입을 기반으로 클래스와 비슷하게 동작하게끔 하는 다양한 기법들이 도입되어 왔다. 

 

클래스 상속을 흉내내기 위한 세 가지 방법으로, SubClass.prototype에 SuperClass의 인스턴스를 할당한 다음 프로퍼티를 모두 삭제하는 방법, 빈 함수(Bridge)를 활용하는 방법, Object.create를 이용하는 방법 등이 있다.

이 세 방법 모두 constructor 프로퍼티가 원래의 생성자 함수를 바라보도록 조정해야 한다.

 

ES6에서는 상당히 간단하게 처리되낟.