상속
여기 하나의 클래스가 있고 속성1개와 메서드1개를 가지고 있다.
또 하나의 클래스를 정의하는데 아무 내용도 없는 클래스로 만든다.
빈 클래스 MyChild에 new를 사용해 아까 만든 클래스 MyParent를 상속받는다.
빈 클래스를 child의 이름으로 인스턴스 생성을 한 뒤
부모클래스의 메소드인 method1을 호출해본다.
빈 클래스의 인스턴스인 child가 상속이 되어서 부모클래스의 메소드를 호출할 수 있다.
상속 - 확장
CellPhone을 부모 클래스로 생성하고 DmbCellPhone클래스에 상속을 시킨다.
이번엔 자식클래스를 빈 클래스로 만들지 말고 프로퍼티와 메서드를 함께 생성한다.
상속받은 자식클래스의 인스턴스를 생성하고 부모클래스의 메서드와 자신의 메서드를 모두 호출해본다.
상속은 부모의 메서드와 프로퍼티를 사용할 수도 있으며 자신의 것 또한 사용이 가능하다.
상속 - 중복성 제거
공통된 내용인 method1을 가지는 클래스 두 개가 있다. (method2는 내용이 다르므로 다른 메서드)
클래스 A와B의 인스턴스는 공통된 프로퍼티인 property1에 접근하며
동일한 내용의 method1을 호출하고 있다.
공통된 부분들을 각 클래스에서 제거한 뒤 하나의 부모클래스에 작성하고
두 클래스에 상속한다.
아까와 같은 내용을 실행해보니 똑같이 동작하는 것을 볼 수 있다.
이렇게 상속으로 중복되는 코드들을 제거할 수 있다.
상속 - 연동, call( )
프로퍼티와 메서드를 하나씩 가지는 클래스를 생성한다.
자식클래스를 생성하고 상속을 받은 뒤 인스턴스를 생성한다.
생성한 인스턴스의 프로퍼티를 호출하고 상속받은 부모의 메소드 또한 호출해본다.
상속받은 자식의 인스턴스를 생성할 때
부모의 인스턴스가 먼저 생성되고
call함수를 통해 생성자가 호출되며 자식인스턴스가 생성된 후
부모 인스턴스에 추가되어
param1인자값으로 받은 값이 부모속성 property1에 추가되었다.
'Front-end > JavaScript' 카테고리의 다른 글
[JS] 중복없는 자료구조, Set (0) | 2022.08.07 |
---|---|
[JS] 자바스크립트에서 오버로딩, 오버라이딩, constructor, arguments (0) | 2022.06.25 |
[JS] 클래스 프로퍼티와 메서드 (0) | 2022.06.19 |
[JS] 함수형 설계와 클래스형 설계 (0) | 2022.06.17 |
[JS] 프로토타입 클래스 (0) | 2022.06.15 |