[TIL] class

✅ Class

클래스는 객체지향 프로그래밍의 핵심이다.
객체 지향 프로그래밍이란, 프로그램을 객체들로 구성하고, 객체들 간에 서로 상호 작용하도록 작성하는 방법이다.
객체를 매번 만들어서 사용해도 좋지만, 큰 규모의 객체이거나 비슷한 모양의 객체를 계속 만들어야 한다면, class라는 설계도를 통해 만들 수 있다.
class를 붕어빵 틀이라고 이야기하는 이유도 바로 이것이다.

class : Object를 만들어내는 틀 (붕어빵 틀)
instance : Class를 통해서 만들어진 Object (붕어빵)

let ray = {
  name: 'Ray',
  price: 2000000,
  getName() {
    return this.name;
  },
  getPrice() {
    return this.price;
  },
  applyDiscount(discount) {
    return this.price * discount;
  }
}

ray라는 객체는 각각 5개의 프로퍼티를 가지고 있다. 프로퍼티에는 함수도 포함되어 있다.
위에서 getPrice라는 함수는 다음과 같이 호출도 가능하다.

const rayPriceByFunction = ray.getPrice();
console.log('함수로 접근 => '+rayPriceByFunction);

객체 내부에서, 해당 객체의 프로퍼티에 접근하려면,this라는 키워드를 사용할 수 있다.
만약, 새로운 차를 추가한다면 차마다 객체를 늘려나가서 코드가 길어지는 것이 아니라,
필요한 정보를 담은 Car라는 클래스(class)를 생성하여 관리할 수 있다.

class Car {
  constructor(name, price) {
    this.name = name;
    this.price = price;
    this.department = '선릉지점';
    this.salesAmount = 0;
  }
  
  applyDiscount(discount) {
    return this.price * discount;
  }
  
  addSales() {
    this.salesAmount++;
  }
}

✅ 생성자(Constructor)

객체의 설계도인 클래스는 문법이 비슷하다.
둘의 가장 큰 차이는 constructor라는 생성자 함수이다.
아래 코드는 class를 통해 객체를 생성한다.

const morning = new Car('Morning', 2000000); //새로운 객체 생성 -> '인스턴스화'

이와 같이 class로 객체를 생성하는 과정을 '인스턴스화'라고 하고,
class를 통해 생성된 객체를 '인스턴스'라고 부른다.
class는 새로운 instance를 생성할 때마다 constructor() 메서드를 호출한다.

✅ 인스턴스(Instance)

인스턴스는 class를 통해 생성된 객체이다.
class의 property이름과 method를 갖는 객체이다.
인스턴스마다 모두 다른 프로퍼티 값을 갖고 있다.

✅ 메서드(Methods)

메서드는 함수이다.
그런데 객체가 프로퍼티 값으로 갖고 있는 것을 메서드라고 부른다.
class의 메소드는 객체와는 달리 comma(,)로 구분하지 않는다.

✏️ class를 생성을 연습해보자.

class MyMath {
  constructor(num1, num2) {
    this.num1 = num1;
    this.num2 = num2;
  }
  
  getNumber() {
    return [this.num1, this.num2];
  }
  
  add() {
    return this.num1 + this.num2; 
  }
  
  substract() {
    return this.num1 - this.num2;
  }
  
  multiply() {
    return this.num1 * this.num2;
  }
}

const get = new MyMath(1, 2);
console.log(get); 
console.log(get.getNumber()); // [1,2]
console.log(get.add()); // 3
console.log(get.substract()); // -1
console.log(get.multiply()); // 2