For Programmer

자바스크립트 - 상속 본문

Programming language/JavaScript

자바스크립트 - 상속

유지광이 2020. 7. 24. 15:07
728x90

우선 자바스크립트의 상속을 이해하기 위해선 prototype의 개념을 자세하게 알아야합니다.

prototype에대해서 자세하게 정리가 되어있는 글이 있기 때문에 링크 남기겠습니다.

https://ji-gwang.tistory.com/42

 

자바스크립트 - prototype(프로토타입)

프로토타입 이해하기 *Person() 함수를 이용해서 객체를 생성하게 되면 sum() 함수도 무조건 같이 생성되게 된다. 이는 메모리낭비를 가져올 수 있으며 이때 사용가능한 것이 prototype이다. prototype은

ji-gwang.tistory.com

상속의 기본예제1

출력결과

*p1은 Programmer 생성자함수를 이용해 만들어진 변수이다. 그러나 Programmer에는 introduce라는 메서드가 없는데 p1의변수에서는 introduce라는 메서드에 접근하고있다. 이게 어떻게 가능한 일이까? 우선 말로설명을 하자면 Person이라는 함수에 prototype에 introduce라는 함수를 생성하였다. 그리고 Programmer.prototype = new Person();으로 Programmer.prototype이 Person함수를 바라보게 설정하였다. 따라서 이를 Programmer생성자함수를 통해 변수 p1을 생성하였고 p1은 introduce메서드에 접근이 가능한것이다.  이를 완벽하게 이해하기 위해서는 다음 그림을 참고하자

 

 

상속의 기본예제2

출력결과

* Person 객체를 Programmer Design 객체 둘이서 상속을 받고있는형태이다.

상속에서 오버라이딩

 

* Ultra의 prototype에 Ultraprop이라는 변수가 있고 이를 true값으로 정의하였다. 그러나 Super함수가 Ultra함수를 상속받고 ultraProp의 값을 4로 오버라이딩 하고있다. 따라서 또 이를 Sub함수가 상속받고 이를 변수 o에 생성하게 되면 o는 ultraProp이라는 값에 접근할때 상속받은 차례차례 올라가기때문에 ultraProp라는 값이 Ultra라는 함수와 Super에 둘다있는데 아까 말했듯이 차례차례 역순으로 올라가면서 찾기때문에 Super라는 함수에 먼저 있기때문에 4가 출력이된다. 

728x90
Comments