관리 메뉴

KorSA

[ JavaScript ES 6 ] 상속 본문

Knowledge Wiki/Javascript

[ JavaScript ES 6 ] 상속

Praiv. 2021. 12. 16. 18:14
320x100

1. ES5 상속 기능 -> 2010년 부터는 ES5 스타일로 상속을 쉽게 구현함

child.create(parent); // parent를 상속받아 child를 생성, 즉 child의 prototype이 parent가 됨


2. ES6 상속 기능 -> 타 객체지향언어 스타일

class parent {
	constructor(){
		this.name = 'Kim';
		this.sayHi = function(){}
	}
	sayHi2(){
	}
}

var child = new parent();

child.sayHi(); // 있음
chid.sayHi2(); // 없음. constructor에 선언된게 아니니까.


3. extends 와 super

class granpa {
	constructor(name){
		this.first = 'Kim';
		this.name = name;
	}
	sayHi(){
		console.log('granpa');
	}
}

class father extends granpa{
	constructor(name){
		super(name); // 부모 class의 constructor를 먼저 호출해줘야 함
		this.age = 50;
	}
	sayHi(){
		console.log('father');
		super.sayHi(); // super는 부모 class를 의미함
	}
}

var fa = ne father('만수');

fa.sayHi(); // father granpa --> 위계상 가까이에 있는 sayHi()를 호출

 

 

 

728x90
728x90

'Knowledge Wiki > Javascript' 카테고리의 다른 글

[ JavaScript ES 6 ] Destructuring  (0) 2021.12.17
[ JavaScript ES 6 ] getter, setter  (0) 2021.12.16
[ JavaScript ES 6 ] prototype  (0) 2021.12.16
[ JavaScript ES 6 ] Spread Operator  (0) 2021.12.16
[ JavaScript ES 6 ] Tagged Literal  (0) 2021.12.16
Comments