객체 간 타입 호환성 (feat. 슈퍼 타입과 서브 타입)type Type1 = { name: string; color: string; phone: number;}type Type2 = { name: string; color: string;}let user1: Type1 = { name: 'Kim', color: 'blue', phone: 1234}let user2: Type2 = { name: 'Lee', color: 'red'}user2 = user1; // 정상user1 = user2; // Error! 여기서 에러가 나는 이유는?타입스크립트의 슈퍼 타입과 서브 타입을 공부하면서 객체끼리 서로 할당이 될 때, 어떤 객체가 슈퍼 타입인지에 대해 공..

타입 가드 is를 사용하는 이유 타입 가드의 역할은 변수가 특정 타입인지의 여부를 확인하고, 이를 확실히 한 뒤 해당 타입을 안전하게 사용할 수 있도록 하는 것이다. 주로 is...로 시작하는 함수에서 타입 가드를 많이 사용하며, 이것이 문자열인지, 숫자인지 혹은 배열인지 등의 타입을 명시적으로 하기 위해 사용된다. 예시 코드를 보면서 함께 이해하자. function isNumber(value: any): value is number { return typeof value === 'number'; } function printNumber(value: any) { if (isNumber(value)) { console.log(value + 10); } else { console.log('이것은 숫자가 아닙..

유틸리티 타입이란? 유틸리티 타입이란, 제네릭, 맵드 타입, 조건부 타입 등의 타입 조작 기능을 이용해서 타입 스크립트 코드에서 타입을 더욱 강력하고 유연하게 다룰 수 있도록 도와주는 기능들을 말한다. 즉, 모든 프로퍼티들을 선택적 프로퍼티로 바꿔주거나 특정 프로퍼티만 골라내는 등의 자주 사용되는 타입들을 마치 내장 함수처럼 타입스크립트 자체에서 제공해 주는 타입인 것이다. 들어가기 전, 이 글에서는 타입스크립트에 있는 모든 유틸리티 타입을 정리하지 않을 것이다. 유틸리티 타입 중에서도 자주 사용되는 타입들만 정리할 예정이며 이외에도 다른 유틸리티 타입이 궁금하다면 타입스크립트 공식문서를 참고하길 바란다. 객체 타입에서 사용하는 유틸리티 타입 Partial / Required : 필수 프로퍼티 ⇔ 선택적..

조건부 타입이란? type A = number extends string ? string : number; // number extends string이 참이면 string, 거짓이면 number type ObjA = {a: number}; type ObjB = {a: number; b: number}; type B = ObjB extends ObjA ? number : string; // ObjB가 ObjA의 서브 타입이므로 true => number 타입 타입스크립트에서 삼항 연산자를 이용해 타입을 정하는 것을 조건부 타입이라고 한다. 주로 조건식으로 A extends B를 사용하며 A가 B의 서브 타입이면 true, 아니면 false를 반환한다. 위의 예시 코드를 보면 타입 A의 조건식은 numbe..

인덱스드 액세스 타입(Indexed Access) interface User { id: number; name: string; profile: { job: string; mbti: string; } } const userA: User = { id: 0, name: 'Lee', profile: { job: 'developer', mbti: 'INFJ' } } // 타입의 특정 인덱스 타입을 가져오고 싶을 때 ['인덱스']로 가져올 수 있다. function getUserProfile(profile: User['profile']) { console.log(`${profile.job}-${profile.mbti}`); } getUserProfile({job: 'designer', mbti: 'ENFP'}); ..