🙋 목표: 자바스크립트 기초를 공부하고 부족한 부분을 채우자.

1. Class

---

🙌 클래스는 객체지향 프로그래밍의 핵심이다.

객체지향 프로그래밍이란, 프로그램을 객체들로 구성하고, 객체들 간 서로 상호 작용 하도록 작성하는 방법이다.

자바스크립트는 객체지향 중심의 언어는 아니다.

그러나 우리 프로그래밍에 있어서 Class, 객체, 객체지향은 항상 중요한 주제이다. 이것을 이해하는 것이 중요하다고 생각한다.

'객체지향 프로그래밍' 이라는 것은 단순히 { num: 1} 을 말하는 것이 아니다.

객체는 영어로 Object, 이름 그대로 사물을 뜻한다.

하지만 Class는 결국 { num: 1} 와 같이 생긴 객체를 잘 설계하기 위한 틀은 맞다. 템플릿이라고 보면 된다.

그런데 이 때 객체는 특정 로직을 갖고 있는 행동(method)과 변경 가능한 상태(멤버 변수)를 가진다.

원하는 구조의 객체 틀을 짜고, 비슷한 모양의 객체를 여러가지 찍어낼 수 있다.

객체를 매번 만들어서 사용해도 괜찮지만, 규모가 커진다면 Class라는 설계도를 통해 만들 수 있다.

잘 이해하고 넘어가자!

2. 생성자(Constructor)

---

객체의 설계도인 클래스는 문법이 비슷하다.

둘의 가장 큰 차이는 constructor라는 생성자 함수이다.

const morning = new Car('Morning', 2000000);

이런식으로 class로 객체를 생성하는 과정을 '인스턴스화'라고 한다.

class는 새로운 instance를 생성할 때마다 constructor() 함수를 호출한다.

class Car {
  constructor(name, price) {
    this.name = name;
    this.price = price;
  }
}

• 클래스 이름은 CamelCase로 작성한다.
• 위 메소드는 name, price라는 2개의 argument(인자)를 받는다.
• 메소드에 this 키워드를 사용했는데 class에서 this 는 해당 instance를 의미한다.
• 메소드에서 넘어오는 name, price를 사용해서 name, price 프로퍼티에 값을 할당했다.
• 이렇게 클래스 안에서 name, price와 같이 변경 가능한 상태값이자 class내의 컨텍스트에서 어느 곳에서나 사용할 수 있는 변수를 '멤버 변수'라고 부른다.
• 멤버 변수는 this 라는 키워드로 접근한다.

2. 인스턴스(Instance)

---

인스턴스는 class를 통해 생성된 객체이다.

인스턴스는 class의 프로퍼티 이름과 메소드를 갖는 객체이다.

인스턴스마다 모두 다른 프로퍼티 값을 갖는다.

const morning = new Car('Morning', 200000000);

const spaceship = new Car('우주선', 25000000);
console.log(spaceship);
console.log(spaceship.name); 
console.log(spaceship.price); 
console.log(spaceship.applyDiscount(0.5));

3.메소드(Methods)

---

메소드는 함수이다.

그런데 객체가 프로퍼티 값으로 갖고 있는 것을 메소드라고 부른다.

class의 method는 Object(객체)의 문법과도 같다.

다만, 객체는 프로퍼티마다 콤마(,)로 구분해줘야 했지만, 클래스는 그렇지 않다.

class Car {
  constructor(name, price) {
    this.name = name;
    this.price = price;
    this.department = "선릉지점";
  }
 
  applyDiscount(discount) {  
    return this.price * discount;   
  }
 
  changeDepartment(departmentName) {
    this.department = departmentName;
  }
}

4. Assignment

---

class 생성을 해 보자.

• MyMath 라는 class를 생성하기
• constructor 에서는 숫자 2개를 인자로 받아 프로퍼티로 저장
• 총 4개의 메서드를 구현해하기
  • getNumber : 두 개의 숫자가 무엇인지 배열로 반환하는 메서드 → ex) [1, 2]
  • add : 두 개의 숫자를 더하는 메서드
  • substract : 두 개의 숫자를 빼는 메서드
  • multiply : 두 개의 숫자를 곱하는 메서드

class MyMath {
    constructor(num1, num2) {
        this.num1 = num1;
        this.num2 = num2;
    }

    getNumber() {
        const arr = [];
        arr.push(this.num1);
        arr.push(this.num2);
        return arr;
    }

    add() {
        return this.num1 + this.num2;
    }

    substract() {
        return this.num1 - this.num2;
    }

    multiply() {
        return this.num1 * this.num2;
    }
}