7일차 스터디 - TypeScript Essential
TypeScript Essential
TypeScript란?
TypeScript는 정적 타입 검사자(A Static Type Checker)입니다.
프로그램을 실행시키지 않으면서 코드의 오류를 검출하는 것을 정적 검사라고 합니다.
이것과 더불어 어떤 것이 오류인지와 어떤 것이 연산되는 값에 기인하지 않음을 정하는 것을 정적 타입검사라고 합니다.
또한 TypeScript는 JS의 구문이 허용되는 타입이 있는 JavaScript의 상위 집합언어입니다.
그렇기 때문에 JavaScript를 모르는 상태에서 TypeScript를 배울 수 없으며 반대로 JavaScript를 배우면 TypeScript를 배우는데 도움이 될것입니다.
기본타입
인터페이스 (Interface)
TypeScript의 핵심 원칙 중 하나는 타입 검사가 값의 형태에 초점을 맞추고 있다는 것입니다.
이를 “덕 타이핑(duck typing)” 혹은 “구조적 서브타이핑 (structural subtyping)”이라고도 합니다.
TypeScript에서, 인터페이스는 이런 타입들의 이름을 짓는 역할을 하고 코드 안의 계약을 정의하는 것뿐만 아니라 프로젝트 외부에서 사용하는 코드의 계약을 정의하는 강력한 방법입니다.
선택적 프로퍼티 (Optional Properties)
함수에서의 타입지정
리터럴 타입
유니언과 교차 타입 (Union and Intersection Types)
유니언 타입
가끔, number나 string을 매개변수로 기대하는 라이브러리를 사용할 때가 있습니다. 예를 들어, 다음 함수를 사용할 때입니다:
교차 타입
교차 타입은 여러 타입을 하나로 결합합니다.
기존 타입을 합쳐 필요한 기능을 모두 가진 단일 타입을 얻을 수 있습니다.
제네릭 (Generics)
Utility Types
Partial<T>
T의 모든 프로퍼티를 선택적으로 만드는 타입을 구성합니다.
이 유틸리티는 주어진 타입의 모든 하위 타입 집합을 나타내는 타입을 반환합니다.
예제 (Example)
Readonly<T>
T의 모든 프로퍼티를 읽기 전용(readonly)으로 설정한 타입을 구성합니다.
즉 생성된 타입의 프로퍼티는 재할당할 수 없습니다.
예제 (Example)
Pick<T,K>
T에서 프로퍼티 K의 집합을 선택해 타입을 구성합니다.
예제 (Example)
Omit<T,K>
Pick과는 반대로 T에서 모든 프로퍼티를 선택한 다음 K를 제거한 타입을 구성합니다.
예제 (Example)
Required<T>
T의 모든 프로퍼티가 필수로 설정된 타입을 구성합니다.
예제 (Example)
과제
링크: 7일차 과제
Infinite Scroll 구현
인스타그램, 페이스북 등 스크롤에 반응하여 무한으로 데이터를 불러오게 하는 기능입니다.
- Custom React Hook을 구현해야 합니다.
- API
- URL: https://yts.mx/api/v2/list_movies.json
- Params
- page: currentPage
- limit: 한 페이지당 불러올 데이터 개수
- 구현하는데 있어 정답이 있지는 않습니다. 오히려 많은 방법들이 있으니 구글링을 적극 활용하여 구현해 주시면 됩니다.
- 버그는 없어야 하며 중복데이터를 제거해야 합니다.
- 라이브러리는 사용하지 말고(Hook 제외) 직접 구현하셔야 합니다!
