- Today
- Total
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- Docker
- CRUD
- Refactoring
- sql
- TIL
- TWIL
- react
- CSS
- 배포
- 아고라스테이츠
- javascript
- LEVEL1
- 면접을 위한 cs 전공지식 노트
- TMIL
- 리팩터링 2판
- mongodb
- 프로그래머스
- 코어 자바스크립트
- 알고리즘
- MariaDB
- LEVEL 1
- LEVEL 2
- 에러핸들링
- First Project
- typescript
- java
- Git
- 오늘도 개발자가 안된다고 말했다
- 코딩테스트
- Err-Handling
성장에 목마른 코린이
TypeScript 9. Interfaces part 2 본문
Interfaces
시작하기전에, 추상 클래스에 대해 한번 더 복습해보자고 한다.
왜냐하면 여기서 추상화를 원할 때 클래스와 인터페이스를 사용할 때의 차이점에 대해 알아보려하기 때문이다.
추상 클래스는 그것으로부터 인스턴스를 만드는걸 허용하지 않습니다.
new User를 만들수 없습니다.
추상 클래스는 상속받는 클래스가 어떻게 동작해야할 지 알려주기 위해 사용됩니다.
추상 클래스를 사용하는 것이 멋있다고 생각하는데
클래스를 어떻게 구현할지에 대해서는 말해주지 않지만, 무엇을 구현해야 할지에 대해서는 알려줄 수 있기 때문이다.
추상 클래스의 문제점은, 자바스크립트에는 abstract의 개념이 없다는 것이다.
그럼 왜 추상 클래스를 사용하냐면, 표준화된 property와 메소드를 갖도록 해주는 청사진을 만들기 위해서이다.
그럼 인터페이스에 대해 다시 얘기해보면, interface는 가볍습니다.
interface는 컴파일하면 JS로 바뀌지 않고 사라집니다.
그럼 인터페이스를 쓸 때 클래스가 특정 형태를 따르도록 어떻게 강제하는지에 대한 질문이 떠오를 수 있는데,
이건 엄청 중요한 질문입니다.
일단 제가 하고 싶은 건 추상클래스를 interface로 바꾸는 것입니다.
interface는 constructor가 없고 abstract 메소드도 없습니다.
하지만 interface는 오브젝트나 클래스의 모양을 묘사하도록 해줍니다.
아래의 예시를 통해 어떻게 클래스가 특정 형태를 따르도록 강제하는지 볼 수 있습니다.
먼저 이렇게 interface로 첫번째 예시와 똑같은 기능을 하게끔 만들어 보았는데요,
기존에는 extend를 사용했지만, 지금은 implements를 사용하고 있는 걸 볼 수 있습니다.
자바스크립트는 클래스 뒤에 extends를 붙이는 문법을 사용해 클래스를 상속받을 수 있습니다.
하지만 타입스크립트에서는 자바스크립트가 사용하지 않는 implements 라는 단어를 쓰는데요,
implements를 쓰면 가장 먼저 코드가 더 가벼워집니다.
자바스크립트에서는 존재하지 않기에 User 인터페이스를 추적할 수가 없습니다.
그리고 interface를 상속할 때에는 property를 private나 protected로 만들지 못하고 public으로만 만들 수 있습니다.
그리고 아까 질문을 대답하자면, interface를 만들어 implements를 통해 상속받을 때
이렇게 클래스가 특정 형태를 따르게 강제하게끔 에러를 출력하는 것을 볼 수 있습니다.
그리고 interface part 1에서 배웠던 여러 interface를 합칠 수 있는 기능이 여기서 유용하게 쓰입니다.
이렇게 implements를 이용해 여러 interface를 사용할 수 있기에 필요한 기능을 합쳐서 쓸 수 있어 너무 유용하겠죠.
'TypeScript' 카테고리의 다른 글
TS BlockChain 0. 소개 밑바닥부터 프로젝트 설정 (0) | 2022.08.01 |
---|---|
TypeScript 10. Polymorphism (다형성, 제네릭, 클래스, 인터페이스 Combined) (0) | 2022.08.01 |
TypeScript 8. Interfaces part 1 (0) | 2022.08.01 |
TypeScript 7. Classes Recap + 챌린지 (0) | 2022.07.30 |
TypeScript 6. Classes: abstract class, method, public, private, protected (0) | 2022.07.30 |