JavaScript - Class

 Class

객체지향 프로그래밍의 핵심입니다.

이 클라스라는 것이 왜 필요하는지 생각을 해보면 백만개의 오브젝트를 만들면 자바스크립트 파일에 너무나도 많은 양의 데이터를 삽입해야합니다. 그래서 큰 틀을 만들고 큰틀에 재료만 바꿔서 데이터를 찍어내는 느낌으로 진행을 하면 작성해야하는 양이 확연히 줄게 되겠죠?

 

뭐... 롤 케릭터나 자동차의 정보 등 너무 많은 케릭터나 차가 있다면? 이 클라스를 사용하여 정보를 만드는 것이 편하다고 생각합니다.

롤을 좋아하기 때문에 롤 케릭터로 예를 만들어 보겠습니다.

 

(하기에 작성한 유투버의 class 설명은 100번 봐도 유의미합니다. 아주 좋습니다.)

const 가렌 = {

    Q : '침묵',

    W : '방어'

}

const 누누 = {

    Q : '강타',

    W : '눈덩이 굴리기'

}

이렇게 게임 케릭터를 만든다고 할 때 100몇개가 되는 케릭터를 다 넣으려면 정신이 나가버릴 것입니다.

따라서, class를 이용해서 뼈대를 만들고 살을 붙이는 형태를 사용하게 됩니다.

 

class lolchar {

    constructor(Q,W){

        this.Q = Q

        this.W= W

    }

}

let 가렌 = new lolchar('침묵','방어')

let 누누 = new lolchar('강타','눈덩이 굴리기')

이렇게 뼈대를 만들고 살만 붙이면 다음 케릭터를 만들 때도 객체를 직접 만드는 것보다 몇배는 빠르게 만들 수 있을 것 같습니다.

 

그 다음은 class 속 constructor 와 method 를 확인해 봐야합니다. 

constructor (a,b,c,....) {} 이 속에는 class에 있는 메소드를 실행하기 위한 변수를 집어넣는 곳이고,

method는 class 속에 있는 함수라고 생각하면 됩니다.

 

method가 많은데 method에 계속 중복되거나 자주 사용되는 변수가 있다면 constructor에 넣어서 간편하게 사용하는 것을 추천합니다.

 

class 의 메소드를 보여드리겠습니다.

 

class Car {

    constructor(name, price) {

      this.name = name;

      this.price = price;

      this.department = "선릉지점";

    }

 

    applyDiscount(discount) {  

      return this.price * discount;  

    }

 

    changeDepartment(departmentName) {

      this.department = departmentName;

    }

  }

이렇게 있으면  / let K3 = new Car (k3,2500)

하고 차의 80%할인 가격을 알고 싶으면 

K3.applyDiscout(0.8) 이라고 치면 확인이 가능해 집니다.

 

이런식으로 간편하게 객체를 만들 수 있기 때문에 객체의 수가 많다고 생각이 되면 꼭 class를 만들어 보아요!

---

https://www.youtube.com/watch?v=dHrI-_xq1Vo