-
자바스크립트 추상클래스 어떻게 작성할까요?자바스크립트 2023. 3. 12. 12:54반응형
추상 클래스면 직접 생성이 불가능하고 추상메소드의 구현을 강제 해야 되잖아요?
class Parent { constructor() { // 직접 생성하는거 못하게 할게요 if (this.constructor === Parent) { throw Error("This is abstract class"); } // 추상 메소드 구현하라고 강제할게요 if (this.abstractMethod === Parent.prototype.abstractMethod) { throw Error("you should implement abstract method"); } } abstractMethod() { throw Error("This is abstract method"); } } class Children extends Parent { abstractMethod() { console.log('called abstractMethod from children'); } }위 예제코드를 보시면 부모 생성자에서 현재 생성자가 Parent하고 동일하냐고 물어보는거에요
이것이 동일하면 부모를 생성한거고 아니면 다른 무언가를 생성한거에요
그리고 그 아래부분은 추상메소드 구현을 강제한거에요
현재 내가 가지고 있는 메소드하고 Parent가 가지고 있는 메소드가 동일하냐고 물어보는거에요
부모 클래스에서 가지고있는 메소드하고 동일하다면 자식은 해당 메소드를 구현하지 않은거니까
구현해서 오라고 에러를 던지고 있는 코드에요
부모 클래스에서 구현된 추상메소드에 에러를 던지는 부분은 사실상 필요 없어요
호출될일이 없거든요 생성자에서 다 처리해놔서요
상속구조를 살펴보면 자식은 부모의 프로토타입과 자신의 생성자를가지게 되요
자식이 가지고 있는 프로토타입은 부모 조상(위 예제에서는 object가 되겠죠?)의 프로토타입과 부모 자신의 생성자를 가지게 되죠
상속을 반복하게 되면 위에 설명드린 것이 계속 반복되는거고 이것을 프로토타입 체인이라고 해요
그리고 우리가 속성이나 메소드를 사용할때 가장 가까운 곳에서부터 찾아요
const children = new Children() // 부모가 가진거 + 자식이 바꿔치기하고 추가한거 children.__proto__ // 부모의 부모가 가진거 + 부모가 부모의부모꺼를 바꿔치기하고 추가한거 children.__proto__.__proto__ // 자식꺼가 되겠져? 자식이 바꿔치기(오버라이딩) 해놨잖아요 children.__proto__.abstractMethod // 부모꺼가 되겠져? children.__proto__.__proto__.abstractMethod아그리고 prototype 하고 __proto__의 차이점은요
prototype은 Person이라는 class 그 자체에서 제공하는 속성이고 __proto_는 생성된 객체에서 제공하 prototype 에대한 setter/ getter 함수라고 보시면되요
그래서 Person의 프로토타입을 알고 싶으면 Person.prototype, Person 객체의 프로토타입을 알고 싶으면 new Person().__proto__ 이렇게 되는거에요
그럼 위에 예제에서 보이는 this.abstractMethod === Parent.prototype.abstractMethod 코드 있잖아요
이거 __proto_기반으로 체크해볼게요
this.abstractMethod === this.__proto__.__proto__.abstractMethod 이렇게 해도 동일하게 되겠네요
반응형'자바스크립트' 카테고리의 다른 글
자바스크립트 babel에 이어서 eslint 도 같이 써볼래요? (0) 2023.03.12 자바스크립트 babel 사용 해볼래요? (0) 2023.03.12 자바스크립트 nullish 병합 연산자에 대해 아십니까? (0) 2023.03.12 class 문법에서 접근제한자 어떻게 해야 할까요? (0) 2023.03.11 React + Mobx, Redux 대신에 Mobx로 상태 관리 편하게 해보실래요? (0) 2023.03.11