클래스 기본

클래스(Class)는 객체를 생성하기 위한 템플릿이다.

클래스는 데이터와 이를 조작하는 코드를 하나로 추상화한다.

자바스크립트에서 클래스는 자바스크립트 문법(?) 중 하나인 프로토타입을 이용해서 만들어졌다.

 

클래스는 특별한 함수 정도로 취급할 수 있다.

함수가 함수 표현식과 함수 선언을 갖듯이

클래스도 클래스 표현식과 클래스 선언문을 갖는다.

 

클래스로 찍어낸 객체들은 인스턴스(Instance)라고 불리운다.

모든 객체가 인스턴스가 되는 것이 아니다.

클래스로 찍어낸 객체여야만 인스턴스라고 불리운다.

 

class Rrrr {
    constructor(){}
    function() {}
    function() {}
}

class Human {
    constructor(age, tall) {
    this.age = age;
    this.tall = tall;
    }
    function() {}
    function() {}
}

 

생성자(Constructor)

생성자 메서드는 class로 생성된 객체를 생성하고 초기화하기 위한 특수한 메서드이다.

생성자 메서드는 클래스 안에 한 개만 존재할 수 있다. (다수 존재 시 SyntaxError)

생성자는 부모 클래스의 생성자를 호출하기 위해 super 키워드를 사용할 수 있다.

 

 

정적 메서드

static 키워드는 클래스를 위한 정적(static) 메서드를 정의한다.

정적 메서드는 클래스의 인스턴스화 없이 호출되며, 클래스의 인스턴스에서는 호출할 수 없다.

class Human {
    constructor(age, tall) {
    this.age = age;
    this.tall = tall;
    }
    static live = true;
}

const DC = new Human(30, 178);  // 클래스 Human의 인스턴스(Instance)
console.log(DC);
console.log(DC.live);
console.log(Human.live);

위 코드에 대한 출력값이다.

클래스 Human으로 DC라는 인스턴스를 찍어냈다.

 

class 내부에 static으로 live 값이 true로 초기화되어 있다.

이 값은 static으로 인해 프로퍼티가 인스턴스로 유전되지 않는다.

오직 class에서만 이 값을 고정적으로 가지고 있다.

 

 

---

상속, super, get, set

class Human {
    constructor(age, tall) {
    this.age = age;
    this.tall = tall;
    }
    static live = true;
} // 생성자로 age, tall 프로퍼티 생성할 수 있도록 함.
  // 살아있는 것이 사람이다! 라는 의미로 static live = true를 human에 static으로 배정.
  // (ㅋㅋ)
  
class DC extends Human {  // class DC는 Human의 확장이다. (DC는 Human을 상속받는다.)
    constructor(live) {   // live라는 인수(argument)를 하나 더 생성할 수 있도록 함)
        super();          // Human의 프로퍼티, 메서드를 super(상속) 받음.
        this.live = live; // live라는 인수를 받는 프로퍼티를 생성함.
    }
    get heWant() {        
        console.log('be backend developer');
    }                     // get으로 함수를 호출할 수 있도록 함.

    set heWant(value) {   
        console.log('set =', value);
    }                     // set으로 함수를 호출할 수 있도록 함.                    
}

const DC2 = new DC('long long live with jiyoung'); // 클래스 DC를 이용해 객체 DC2 생성. 
console.log(Human);         // class Human 출력.
console.log(DC2);           // 객체 DC2 출력
console.log(DC2.heWant);    // DC2.heWant를 get으로 출력.
DC2.heWant = '개발자 되고싶어어어';  // 할당연산자를 받아 set 출력

 

console.log를 받았을 때 왜 뒤에 undefined가 나오는 지 모르겠다.

 

부모 클래스로부터 상속을 받은 자식 클래스에 생성자를 통해 다른 요소를 생성하고 싶다면

먼저 자식 클래스 생성자 메서드 안에 super를 명시해야 한다.

super를 명시함으로써 부모 오브젝트의 요소들을 먼저 호출한 뒤에 새로운 요소를 넣어야

오류가 발생하지 않는다.