25.1 클래스는 프로토타입의 문법적 설탕인가?

자바스크립트는 프로토타입 기반(prototype based) 객체지향 언어다.

프로토타입 기반 객체지향 언어는 클래스가 필요 없는(class free) 객체지향 프로그래밍 언어다. ES5에서는 클래스 없이도 다음과 같이 생성자 함수와 프로토타입을 통해 객체지향 언어의 상속을 구현할 수 있다.

var Person = (function () {
  function Person(name) {
    this.name = name;
  }

  Person.prototype.sayHi = function () {
    console.log(`Hi! My name is ${this.name}`);
  };

  return Person;
})();

var me = new Person("Lee");
me.sayHi(); // Hi! My name is Lee

ES6의 클래스는 자바나 C# 같은 클래스 기반 객체지향 프로그래밍에 익숙한 프로그래머가 더욱 빠르게 학습할 수 있도록 클래스 기반 객체지향 프로그래밍 언어와 매우 흡사한 새로운 객체 생성 메커니즘을 제시한다. 기존의 프로토타입 기반 객체지향 모델을 폐지한 것은 아니다.

클래스 vs. 생성자 함수

클래스와 생성자 함수는 모두 프로토타입 기반의 인스턴스를 생성한다.

클래스는 생성자 함수보다 엄격하며 생성자 함수에서는 제공하지 않는 기능도 제공한다.

클래스의 특징 (생성자 함수와 다른 점)

1. new 연산자 없이 호출하면 에러가 발생한다.
2. 상속을 지원하는 extends와 super 키워드를 제공한다.
3. 호이스팅이 발생하지 않는 것처럼 동작한다. (TDZ)
4. 모든 코드에는 암묵적으로 strict mode가 지정되어 실행되며, 해제할 수 없다.
5. constructor, 프로토타입 메서드, 정적 메서드는 모두 프로퍼티 어트리뷰트 [[Enumerable]] 값이 false다. 즉, 열거되지 않는다.

생성자 함수와 클래스는 모두 프로토타입 기반의 객체지향을 구현했다. 하지만 클래스의 객체 생성 방식은 더욱 견고하고 명료하다. 특히 extends와 super 키워드는 상속 관계 구현을 더욱 간결하고 명료하게 한다. 따라서 클래스를 프로토타입 기반 객체 생성 패턴의 단순한 문법적 설탕이라고 보기보다는 새로운 객체 생성 메커니즘으로 보는 것이 좀 더 합당하다.