extends, super

지은·2022년 9월 22일
0

JavaScript

목록 보기
29/42
post-custom-banner

Constructor

constructor : class의 instance 객체를 생성하고 초기화하는 특별한 메소드

  • 클래스 내에서 생성자 함수(constructor)는 하나만 존재할 수 있다.
class Rectangle {
	constructor() {
		this.name = 'Rectangle';
    }
}

const Rec1 = new Rectangle();
Rec1.name; // 'Rectangle'
  • class에 생성자를 정의하지 않으면, 기본 생성자(default constructor)를 사용한다.
  • 아무것도 상속하지 않는 기본 클래스일 때 기본 생성자는 빈 메소드이다.
constructor() {}
  • 다른 클래스를 상속하는 경우, 기본 생성자는 자신의 매개변수를 부모 클래스의 생성자로 전달한다.
constructor(...args) {
	super(...args);
}

extends

class [자식] extends [부모] : 클래스를 상속하기 위해 클래스 선언 시 사용하는 키워드

class Student extends Human {...}

super

super(...args) : 부모 클래스의 생성자 함수를 호출할 때 사용하는 키워드

  • 생성자 함수 내에서 super 키워드는 하나만 사용해야 한다.
  • 생성자 함수 내에서 this 키워드가 나오기 이전에 호출되어야 한다.
class Human {
	constructor(name, age) {
    	this.name = name;
      	this.age = age;
    }
  	sleep() {
    	console.log('Zzz..');
    }
}

class Student extends Human{
	constructor(name, age, grade) {
    	super(name, age);
      	this.grade = grade;
    }
  	study(num) {
    	this.grade = grade + num;
      	console.log(`${this.name}의 성적이 ${num}만큼 올라 ${this.grade}가 되었습니다.`);
    }
}

let jieun = new Student('Jieun', 26, 90);
jieun.sleep(); // Zzz..

위 코드에서 Human은 부모 클래스, Student는 자식 클래스이다.
➡️ Student 클래스는 extends 키워드를 이용해 Human 클래스를 상속한다.


Default parameters

기본값 매개변수를 설정할 수 있다.

class Rectangle {
	constructor() {
		this.name = 'Rectangle';
      	this.line = 4;
      	this.angle = 90;
    }
}

class Square extends Rectangle {
	constructor() {
    	super();
      	this.name = 'sqaure';
    }
}

let sqr1 = new Square();
sqr1.name; // 'square'
sqr1.line; // 4
sqr1.angle; // 9

❔ 학습 후 궁금한 점

  • 기본 생성자(default constructor)에 대해 제대로 이해하지 못했다.
profile
블로그 이전 -> https://janechun.tistory.com
post-custom-banner

0개의 댓글