일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- leetcode189
- Next.js
- css
- 커스텀알림
- react-firebaseui
- yarn-berry
- mac
- React
- 구조분해할당
- 파이썬
- 파이어베이스로그인
- 백준
- JS
- nvmrc
- Spread
- 기초
- 다리놓기
- iP
- nvm
- 프로토타입
- 타입스크립트
- leetcode977
- react-native
- youtube iframe
- Rest
- 커스텀알락
- Python
- 리액트
- 자바스크립트
- firebaseui
- Today
- Total
JadeCode
[TypsScript] 타입스크립트의 독특한 타입들 (Unknown, Never, Void, Any) 본문
타입스크립트는 자바스크립트에서 타입을 추가한 확장 버전이다.
타입스크립트는 정적 타입 검사를 통해 많은 런타임 오류를 컴파일 타임에 미리 잡아낼 수 있다.
타입 불일치, 함수 호출 오류, 잘못된 객체 접근, 잘못된 반환 값, 잘못된 this 참조 등의 오류를 실행 전에 잡아낼 수 있어 이를 통해 코드의 안정성, 가독성, 유지보수성을 크게 향상시킬 수 있다.
타입스크립트의 타입 중 독특한 타입에 대해 알아보는 시간을 가져보자.
* 더 큰 타입의 값을 더 작은 타입의 값으로 할당하는 것은 안된다.
let num1: number = 10; // 더 큰 타입 ex) 직사각형
let num2: 10 = 10; // 더 작은 타입 ex) 정사각형
num1 = num2; // num1에 num2 할당 가능
num2 = num1; // 오류!
unknown
unknown 타입은 특정 변수의 타입을 확실히 모를 때 사용할 수 있다.
unknown 타입은 모든 타입의 변수의 값으로 집어넣을 수 있다.
모든 타입의 슈퍼타입이라고 볼 수 있다.
하지만 다른 타입에서는 unknown값을 할당하는 것이 불가능하다.
타입 정제를 사용하여 다른 타입에 unknown값을 할당 할 수 있다.
// 업캐스팅
let a: unknown = 1;
let b: unknown = "hello";
let c: unknown = true;
let d: unknown = null;
let e: unknown = undefined;
let unKnowVar: unknown;
// 다운캐스팅
let num: number = unKnowVar; // 에러. Type 'unknown' is not assignable to type 'number'
if (typeof unknownVar === "number") {
// 타입 정제
num = unknownVar;
}
never
never는 불가능, 모순의 의미를 가진다.
모든 타입의 서브타입으로 어느 타입에나 할당이 가능하다.
function neverFunc(): never {
while (true) {}
}
let num: number = neverFunc(); // 업캐스팅 기능
let never1: never = 10;// Type 'number' is not assignable to type 'never'
void
void 타입은 아무것도 없음을 의미한다.
주로 함수 반환값이 없을 때 void 타입을 리턴한다.
왜 undefined라고 반환값을 정의하지 않고, void라고 정의할까?
undefined값이 반환값이라고 명시하면 return undefined라는 문을 써야하기 때문이다.
void는 undefined의 슈퍼타입이기 때문에 void타입을 리턴하면 따로 리턴문을 사용하지 않아도 된다.
any
any타입 역시 unknown타입처럼 특정 변수의 타입을 확실히 모를 때 사용한다.
js 사용하듯이 아무 값이나 담고 싶으면 any 타입을 사용한다.
하지만 차이점은 any값은 업캐스팅, 다운캐스팅 다 가능하다.
let anyVar1: any = 10;
anyVar1 = "hello";
let num: number = 10;
num = anyVar1;
하지만 any타입은 런타임에러를 발생시킬 수 있다는 단점이 있다.
마무리의 말
처음 자바스크립트에서 타입스크립트로 전환할 때, 개념을 깊이 이해하지 않은 채 기능 구현에 집중하다 보니 any 타입을 남발했던 경험이 있다.
당시에는 빠르게 개발하는 데 초점을 맞췄지만, 점점 타입스크립트를 도입한 본래 목적을 잃어가고 있다는 느낌이 들었다.
이후, 보다 정적인 타입 시스템을 활용하기 위해 제대로 학습을 시작했고, 지금은 최대한 명확한 타입을 정의하며 개발하려고 노력하고 있다.
이번 기회를 통해 개념을 다시 정리하면서, 타입스크립트를 더욱 효과적으로 활용할 수 있을 것 같다.
출처 : 한 입 크기로 잘라먹는 타입스크립트 - 이정환 Winterlood (인프런)
'개발' 카테고리의 다른 글
[모노레포] 공통 패키지 만들어 의존성 넣기 (0) | 2023.05.19 |
---|---|
[모노레포] yarn berry 시작하기 (0) | 2023.05.18 |
[모노레포] 협업을 위한 .nvmrc (0) | 2023.05.18 |
React-Query 도입기 (0) | 2023.05.02 |
모노레포(MonoRepo) (0) | 2023.04.27 |