맨 처음 프로그래밍을 배울 때, 자바를 사용해서
자바스크립트의 프로토타입이 약간 낯설었는데
자바스크립트에도 class 문법이 추가되어서 정리할까 한다.
개인적으로 class를 사용하는 것이 훨씬 직관적인 것 같다.

classes - MDN
MDN문서가 잘 정리되어 있어서 너무 좋다.

---

1. 클래스 사용하기

Class는 사실 함수이기 때문에 선언식과 표현식 두 가지 방법으로 사용할 수 있다.

* Class 선언

class Student {
  constructor(string, num) {
    this.name = string;
    this.age = num;
  }
}

Class키워드와 함께 클래스의 이름을 선언한다.
일반적인 함수는 선언식을 사용할 경우 호이스팅이 되지만 클래스는 적용되지 않는다.
즉, 클래스를 선언한 후에만 객체를 생성할 수 있다.

// Reference Error가 일어나는 경우
const yun = new Student(); // Student클래스가 선언되지 않았는데 호출

class Student {}

* Class 표현식

클래스 표현식은 이름을 가질 수도 있고, 가지지 않을 수도 있다.

* 클래스 이름이 없는 표현식

// 클래스 이름이 없는 표현식
var Student = class {
  constructor(string, num){
    this.name = stirng;
    this.age = num;
  }
};

* 클래스 이름이 있는 표현식

// 클래스 이름이 있는 표현식
var Student = class Student2 {
  constructor(string, num){
    this.name = string;
    this.age = num;
  }  
}

이름을 가진 클래스 표현식의 이름은 클래스의 body에 대해 local scope에 한해 유효하다.
^ 이게 무슨 소린지 이해가 잘 안 된다.
영어로는 어떻게 적혀있는지 한 번 본다.
The name given to a named class expression is local to the class's body. (it can be retrieved through the class's (not an instance's) name property, though).
몬소리야ㅋ

아니 장난하냐고 왜 이러냐고
변수는 Student고 여기에 클래스가 할당되어 있다.
클래스 이름이 없으면 변수이름이 곧 클래스 이름이 되고,
클래스 이름이 있으면 그 클래스 이름을 알려주는 건가 보다.

클래스 이름을 가진 표현식을 사용하면 이놈은

var instance = new Student();
// 변수이름으로 생성하네.. 아니 근데 너 Student.name은 Student2라며..

// 에러나는 경우
var instance = new Student2(); // 참조 에러 정의된 적이 없답니다..

클래스 이름 있는 표현식은 도대체 왜 존재하는 걸까?ㅠ

뭘까.. Student는 이름이 Student2인 클래스고
Student2는 Student의 local scope에만 존재하니까
참조에러가 생기는 건가..? 그래서 Global에서는 Student로만 활동하는 거구나..
근데 콘솔 찍으면 왜 Student2라고 하는거니..? 이름은 Student2니까? 징하다 정말..
이름을 가진 클래스를 표현식으로 사용하면 body가 local에만 유효하다는 게 뭔 소린지
대충 알 것 같다. 정말 대충 살고 싶다..

2. 클래스 body

클래스 body는 중괄호 { } 로 묶여 있는 안쪽 부분이다.
이 안쪽에 method, constructor 같은 클래스 members를 정의한다.

• Strict mode

클래스 선언과 클래스 표현식의 본문(body)은 strict mode 에서 실행된다.
strict mode가 아닌 상태에서는 무시되는 오류가 발생하니 조심하자.

• Constructor (생성자)

constructor 메소드는 class 로 생성된 객체를 생성하고 초기화하기 위한 특수한 메소드다.
"constructor"는 클래스 안에 한 개만 존재할 수 있다.
만약 여러 개의 constructor 메소드가 존재하면 SyntaxError가 발생한다.
부모 클래스의 constructor 를 호출하기 위해 super키워드를 사용할 수 있다.

3. method 정의

* Prototype methods

get키워드가 뭔진 모르는데 그냥 메소드를 정의할 때랑 뭔가 다르다.
get키워드를 사용한 경우는 myName이 함수가 아니기 때문에 ()실행은 안되고
그냥 부르면 실행된다.
그냥 메소드를 정의하면 ()실행시키지 않으면 함수 자체를 리턴해준다.
어떻게 써먹을 수 있을지는 아직 잘 모르겠다.
MDN이 이 문서를 참조하라고 했지만 지금은 보기 싫게 생겨서 나중에 보겠다.

* Static methods

여기서 내 밑천이 바닥을 드러낸다.
자바 배울 때 분명히 봤는데 사실 몬소리야ㅋ 하고 넘어간 놈이라 지금도 몬소리야ㅋ
static 키워드는 클래스를 위한 정적(static) 메소드를 정의한다.
정적 메소드는 클래스의 인스턴스화(instantiating) 없이 호출되며,
클래스의 인스턴스에서는 호출할 수 없다.
대충 인스턴스가 호출할 수 없는 메소드라고 보면 되겠다.
정적 메소드는 어플리케이션(application)을 위한 유틸리티(utility) 함수를 생성하는데 주로 사용된다.
^뭔 소린지 전혀 모르겠다!

* Boxing with prototype and static methods

정적 메소드나 프로토타입 메소드가 this 값 없이 호출될 때, this 값은 메소드 안에서 undefined가 된다.
이 동작은 "use strict" 명령어 없이도 같은 방식으로 동작하는데, class 문법 안에 있는 코드는 항상 strict mode 로 실행되기 때문입니다.

4. extends를 통한 클래스 상속

5. super 키워드