함수가 특정기능을 하는 구문(알고리즘, 로직)을 묶을 때 사용하는 문법이라면, 클래스는 이렇게 만들어진 수많은 변수와 함수 중 연관 있는 변수와 함수만을 선별해 포장하는 기술이다.
다시 말해서, 연관있는 변수와 함수를 하나로 묶을 때 사용하는 문법이다.
이렇게 클래스로 묶는 이유는 객체 단위로 코드를 그룹화 할 수 있으며 코드를 재사용이 용이하기 때문이다.

1. Class와 함수의 차이

: Class는 사실 함수다. 함수를 함수 표현식과 함수 선언으로 정의할 수 있듯이 class 문법도 class 표현식과 class 선언 두 가지 방법을 제공한다.

• 함수 선언과 클래스 선언의 차이점은 함수 선언은 호이스팅이 일어나지만, 클래스 선언은 그렇지 않다는 것이다.
• 클래스를 사용하기 위해서는 클래스를 먼저 선언 해야 하며, 그렇지 않으면 ReferenceError 에러가 뜰것이다.

1) 함수 기반 단위

: 특정 기능을 하는 변수 + 알고리즘 등을 묶는 것

• 기능 단위의 코드 그룹화
• 기능 단위의 중복 코드 제거 및 코드 재사용성

2) Class 기반 단위

: 연관 있는 변수와 함수를 묶는 것

• 객체 단위의 변수와 함수
• 객체 단위의 중복 코드 제거 및 코드 재사용.

---

2. Class 선언

: 함수가 function 키워드로 선언하듯, 클래스도 class 라는 키워드로 선언할 수 있다.

1) class 선언

class ClassName {
  constructor(height, width) {
  }
}

• 클래스 이름은 대문자로 시작한다.

2) class 표현식

let ClassName = class {
  constructor(height, width) {
  }
};

• 함수 표현식과 생김새가 비슷하다.

---

3. Instance

1) instance

: 붕어빵을 만든다고 했을때, 붕어빵틀은 class, 붕어빵은 instance가 된다.

var 인스턴스 = new 클래스이름

2) constructor()

: 인스턴스를 만들때마다 생성자 메서드constructor()를 사용해야한다.

class Dog {
  constructor(name) {
    this.name = name;
    this.behavior = 0;
  }
}

• 위의 예시에서 Dog는 클래스다.
• Dog의 인스턴스를 만들기 위해서 constructor 메서드를 호출했고, 이 메서드는 인수로 name을 받는다.
• constructor 안에서 this는 클래스인 Dog를 말한다.

---

4. Methods

: 아래와 같이 메서드를 만들 수 있고 call할 수 있다.

class Dog {
  constructor(name) {
    this._name = name;
    this._behavior = 0;
  }

  get name() {
    return this._name;
  }

  get behavior() {
    return this._behavior;
  }   

  incrementBehavior() {
    this._behavior++;
  }
}

let nikko = new Dog('Nikko'); // Create dog named Nikko
nikko.incrementBehavior(); // Add 1 to nikko instance's behavior
let bradford = new Dog('Bradford'); // Create dog name Bradford
console.log(nikko.behavior); // Logs 1 to the console
console.log(bradford.behavior); // Logs 0 to the console

---

5. Inheritance

1) 자식 클래스 만들기

: 위의 예시처럼 'dog' 외에 'cat'이라는 클래스가 있다고 하자.
이 경우 모든 프로퍼티와 메서드가 전부 동일하다면 부모 클래스 'animal'을 만들어 상속시키는 방법이 있다.

class Animal {
  constructor(name) {
    this._name = name;
    this._behavior = 0;
  }

  get name() {
    return this._name;
  }

  get behavior() {
    return this._behavior;
  }

  incrementBehavior() {
    this._behavior++;
  }
} 

: 위의 'animal' 클래스의 자식 클래스 'cat'을 만들어보자.
새로운 키워드인 extends를 사용해서 자식 클래스를 만들 수 있다.

class Cat extends Animal {
  constructor(name, usesLitter) {
    super(name);
    this._usesLitter = usesLitter; //얜 부모 클래스에 없었으니 super 안씀
  }
}

• 형태 : class 자식클래스명 extends 부모클래스명 {}
• cat클래스에서는 name과 userLitter라는 두개의 인수를 허용한다.
• 생성자 내부에서 super를 함수처럼 호출하면, 부모 클래스의 생성자가 호출됩니다.
• 자식 클래스는 부모 클래스의 메서드를 모두 사용할 수 있게 된다.

6. Static Method

: 자바스크립트의 클래스에서 prototype에 할당되지 않고 클래스 자체에 할당된 함수를 정적 메서드라고 한다.
클래스 자체에 할당되었기 때문에 클래스의 인스턴스를 통해서는 호출될 수 없으며 클래스를 통해 호출해야 한다.
클래스가 가지고 있지만 클래스의 인스턴스에 바인딩되지 않은 기능을 구현하고자 할때 사용된다.

  static generatePassword() {
    return Math.floor(Math.random() * 10000)
  }
// 정적 메서드에는 static을 붙인다.

• 정적 메서드 : 정적 메서드는 인스턴스에서는 접근이 불가능하다.
• 프로토타입 메서드 : 프로토타입 메서드는 접근이 가능하다.