class 상속

🔎 ES5방식으로 구현하는 상속기능

Object.create() 사용하기

Object.create(proto); 매서드는 지정된 프로토타입 객체 및 속성(property)을 갖는 새 객체를 만든다. 소괄호 안에 적은 객체가 prototype이 된다.

var 부모 = { name : 'Kim', age : 50 };
var 자식 = Object.create(부모);

console.log(자식.age); //부모 속성을 상속받아 50이 출력된다.

🔎 class 문법으로 구현하는 constructor

//class 선언

class 부모 {
  constructor(){
    this.name = 'Kim'
  }
}

var 자식 = new 부모();

함수 선언과 클래스 선언의 중요한 차이점은 함수의 경우 정의하기 하기 전에 호출할 수 있지만, 클래스는 반드시 정의한 뒤에 사용할 수 있다.

상속 가능한 함수를 추가하려면?

1. constructor 내부에 추가할 경우 자식은 해당 함수를 직접 가지게 된다.

class 부모 {
  constructor(){
    this.name = 'Kim';
    this.sayHi = function(){ console.log('hello') }
  }
}

var 자식 = new 부모();

2. class 내부에 추가 하면 부모.prototype.sayHi = function(){}과 같은 의미로, 자식에서 해당 함수를 호출하면 부모의 prototype에 있던 값을 가져온다.

class 부모 {
  constructor(){
    this.name = 'Kim';
  }
  sayHi(){ 
    console.log('hello') 
  }
}

var 자식 = new 부모();

🔎 class를 복사하는 extends / super

class product {
	constructor(size){
		this.size = size ;
    }
}

// extends 사용 class 상속
class shirt extends product {
  constructor(size){
   super(size);
   this.price = 30000;
  }
}

var shirt1 = new shirt('s');
// { size : 's' , price = 30000 }

class를 상속하는 class를 만들때는 extends 문법을 사용한다.
상속받는 class에서 this를 사용 하려면 super()를 호출하여 상속하는 class의 constructor값을 가져와야한다.

📌 Object.getPrototypeOf()
이 함수 안에 오브젝트를 넣으시면 부모 prototype을 출력해준다.
proto 라는 키워드와 비슷한 역할을 한다.