272d626ab0a1a4b451d9c5150942fc60.jpg

[javascript] Class

클래스는 수많은 변수와 함수 중 중복되는 변수/ 함수 하나로 묶을 때 사용하는 문법.
이렇게 클래스로 묶는 이유는 객체 단위로 코드를 그룹화 할 수 있으며 코드를 재사용하기 위함.
클래스는 { xxx: 100 } 처럼 생긴 객체(object)를 잘 설계하기 위한 틀.
이 객체는 특정로직을 갖고 있는 행동(method)와 변경 가능한 상태(멤버 변수)를 가짐.
원하는 구조의 객체 틀(class: 빵틀,쿠키틀 etc..)을 짜놓고, 비슷한 모양의 객체(instance : 붕어빵,쿠키,국화빵 etc..)를 공장처럼 찍어낼 수 있다.

스크린샷 2019-10-30 오후 4.35.07.png

  • 인스턴스(instance)
    class를 통해 생성된 객체가 instance
    인스턴스(instance)는 클래스의 속성 이름과 메서드를 포함하지만 고유한 속성 값을 가진 객체.
    클래스는 인스턴스를 생성해야만 클래스에 들어 있는 함수들의 내부 기능들을 사용가능
    참고로, constructor는 'new'없이 호출 될 수 없다

    how to make..?
    let 인스턴스 = new 클래스이름();  
    <ex>
    let apple = new Apple("fruit");
  • 생성자 (constructor)
    class는 새로운 instance를 생성할 때마다 constructor()메서드를 호출
    constructor는 인스턴스의 생성과 동시에 클래스의 생성과 초기화를 실행. 클래스 필드를 초기화해야 한다면 constructor를 생략해서는 x.

멤버변수(class field) : 인스턴스의 프로퍼티 or 정적 프로퍼티.생성자 함수에서 this에 추가한 프로퍼티가 멤버변수

class 1.png

class 2.png

  • 메서드(Methods)
    메서드는 함수.
    객체가 프로퍼티 값으로 갖고 있는 것이며 같은 클래스에 속해있는 모든 객체가 공유하는 함수.
    Class의 method는 Object(객체)의 문법과 같지만 클래스는 프로퍼티마다 comma(,)로 구분 해주지 않아도 됨

class method.png

  • 상속 (inheritance)

스크린샷 2019-10-30 오후 4.58.46.png

  • Super
    근데, 이렇게 상속받은 상태에서 부모클래스한테만 일을 시키고 부모클래스가 하지 못하는 일을 욕심쟁이처럼 나만 할 수 있으려면...?
    -> super() : 괄호가 붙으면 부모 클래스의 생성자
    -> super. : 부모가 가지고 있는 속성 중 .하위의 어떤 것/값을 가져올 수 있는 용법

스크린샷 2019-11-02 오후 3.27.18.png