Class 사용하기

KoEunseo·2022년 7월 25일
0

javascript

목록 보기
14/32

Object.getPrototypeOf()

객체의 프로토타입을 반환

Object.setPrototypeOf()

객체의 정된 객체의 프로토타입 (즉, 내부 [[Prototype]] 프로퍼티)을 다른 객체 또는 null 로 설정

constructor

클래스의 인스턴스 객체를 생성하고 초기화하는 메서드

constructor(속성1, 속성2, 속성3...){}

클래스 내에서 생성자함수는 한번만 쓴다.
다른 모든 메서드 호출보다 앞선 시점인 인스턴스 객체를 초기화할 때 수행할 초기화 코드를 정의할 수 있다.
클래스에 생성자를 정의하지 않으면 기본 생성자를 사용한다.
아무것도 상속하지 않는 기본 클래스일 때: 기본 생성자는 빈 메서드이다.
다른 클래스를 상속하는 경우: 기본 생성자는 부모 생성자를 부른다.

  • 파생 클래스에서 this 사용하기 전에 반드시 super()를 먼저 호출해야함!
class Dog {
  constructor() {
    this.name = 'Selogi';
  }
}

super

생성자에서 super키워드 하나만 사용되거나 this키워드가 사용되기 전에 호출
부모 객체의 함수를 호출하는 데 사용.
생성자 함수 내에서 super키워드는 한번만 사용할 수 있다.

super.prop
super[exor]

extends

클래스를 다른 클래스의 자식으로 만듦

class ChildClass extends ParentClass { ... }

//내장 객체에 extends 사용 가능
class myDate extends Date {
  constructor() {
    super();
  }

  getFormattedDate() {
    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
    return this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear();
  }
}
  • 클래스의 최상위 클래스는 Object이다.
  • EventTarget의 prototype에 addEventListener 메서드가 있다.
    div는 HTMLDivElement의 인스턴스이고 EventTarget을 상속받았기 때문에 addEventListener를 사용할 수 있다.
  • 클래스의 인스턴스는 new로 생성
  • DOM에서는 인스턴스를 createElement로 생성

본래 과제에서는 this.속성에 직접 값을 주는 형식으로 했으나 이렇게 하면 다형성을 해치기 때문에 프로토타입 쓴 의미가 사라진다...

class Grub {
  constructor(age){
    this.age = 0;
  }
}

그래서 다형성도 잡고 과제도 통과하기 위해 이렇게 개선할 수 있음!
생성자에 속성을 줄 때 초기화값을 줄 수가 있다. 이렇게 하면 this.속성은 값을 입력받을 수 있게 됨.

class Grub {
  constructor(age = 0){
    this.age = age;
  }
}

그리고 과제에서는 constructor() 이렇게 작성해도 잘 작동이 되었지만 앞으로 쓸 일이 있다면 작성하는 게 좋겠다.

profile
주니어 플러터 개발자의 고군분투기

0개의 댓글