[TypeScript] typeof, instanceof, literal로 타입 보호하기Language/TypeScript2024. 5. 14. 13:19
Table of Contents
반응형
타입을 보호하는 기술을 익혀 코드의 견고성을 강화하는 여정을 시작하겠습니다. typeof, instanceof, literal을 사용하면 정확한 타입을 적용하고 타입스크립트 프로젝트 초기에 잠재적인 오류를 잡아낼 수 있는 힘을 얻을 수 있습니다. 이러한 기술을 자세히 살펴보면서 의도하지 않은 동작으로부터 코드를 강화하고 더 높은 수준의 유형 안전을 달성하는 방법을 알아보세요.
typeof
typeof
연산자를 사용하면 값이나 변수의 유형을 확인할 수 있습니다. 타입 가드에서 타입을 좁히기 위해 자주 사용됩니다.
function logMessage(message: string | number) {
if (typeof message === 'string') {
// 이 블록 내에서 TypeScript는 'message'가 'string' 유형임을 알고 있습니다.
console.log(message.toUpperCase());
} else {
// 이 블록 안에서, 타입스크립트는 'message'의 타입이 'number'라는 것을 알고 있습니다.
console.log(message.toFixed(2));
}
}
instanceof
instanceof
연산자는 객체가 특정 클래스 또는 생성자 함수의 인스턴스인지 여부를 확인합니다.
class Dog {
bark() {
console.log('Woof!');
}
}
class Cat {
meow() {
console.log('Meow!');
}
}
function petSound(animal: Dog | Cat) {
if (animal instanceof Dog) {
// 이 블록 안에서, 타입스크립트는 'animal'이 'Dog' 타입임을 알고 있습니다.
animal.bark();
} else {
// 이 블록 안에서, 타입스크립트는 'animal'이 'Cat' 타입임을 알고 있습니다.
animal.meow();
}
}
Literal Types
TypeScript의 Literal 타입을 사용하면 변수의 정확한 값을 지정할 수 있습니다.
function handleStatus(status: 'success' | 'error' | 'pending') {
// 'status'는 리터럴 타입 'success', 'error' 또는 'pending'으로 좁혀집니다.
switch (status) {
case 'success':
console.log('Operation succeeded!');
break;
case 'error':
console.log('An error occurred.');
break;
case 'pending':
console.log('Operation is pending.');
break;
}
}
이 예제에서 status
매개변수는 지정된 리터럴 값 중 하나만 가질 수 있습니다.
마무리
이러한 기술을 사용하면 TypeScript가 조건부 블록 내에서 보다 구체적인 유형을 이해하고 적용하여 코드의 유형 안전성을 향상시킬 수 있습니다.
반응형
'Language > TypeScript' 카테고리의 다른 글
디자인 패턴을 사용하여 TypeScript로 확장 가능한 사용자 관리 시스템 구축하기 (1) | 2024.07.29 |
---|---|
[TypeScript] Interfaces vs Classes vs Types (0) | 2024.05.24 |
[TypeScript] Indexed Access Types 및 Mapped Types (1) | 2024.05.13 |
[TypeScript] 엄격한 타입 검사, 고급 컴파일러 옵션 (3) | 2024.05.10 |
[TypeScript] Namespace, Generic and Custom Module (2) | 2024.05.03 |
@고지니어스 :: 규니의 개발 블로그
IT 기술과 개발 내용을 포스팅하는 블로그
포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!