Literal types 리터럴 유형은 string, number보다 구체적인 유형이다. 예를 들어 'hello'는 문자열이지만 문자열은 'hello'가 아니다. 'hello'는 보다 구체적인 유형의 문자열로, 리터럴 형식이 될 수 있다. type Greeting = "Hello" 즉, 타입Greeting 은 Hello 값만 가질 수 있고, 다른 유형의 값은 가질 수 없다. let greeting: Greeting greeting = "Hello" // OK greeting = "Hi" // ❌ 리터럴 유형은 그 자체로는 유용하지 않지만 union types, type aliases, type guards 와 결합하면 강해진다. type Greeting = "Hello" | "Hi" | "Welcome"..
Front-end/TypeScript
TypeScript는 공통 타입 변환을 용이하게 하기 위해 몇 가지 유틸리티 타입을 제공한다. Partial 파셜타입은 특정 타입의 부분집합을 만족하는 타입을 정의한다 interface Login { email : string password : string } type MyLogin = Partial const google : MyLogin = {} const naver : MyLogin = {email : 'sally@naver.com'} const kakao : MyLogin = {email : 'sally@kakao.com', password : 'string'} interface Product { id: number; name: string; price: number; brand: string;..
DefaultProps , Styled-Components의 Props넘겨주는법, Type지정해주는 법에 대해 알아보자. 초기 Props 값 DefaultBadge.defaultProps = { info: "날씨", color: "pink", }; defaultProps 프로퍼티를 할당함으로써 props의 초기값 정의가 가능하다! 공식문서 참고 Styled Component의 props & Type정의 DefaultBadge에서 받아온 color를 Badge의 props로 넘겨주고 type BadgeType = { color?: string; }; const Badge = styled.span` padding: 5px; margin: 10px; border-radius: 3px; background-co..
Non-null assertion operator 변수의 내부 값에 접근할때 TS 컴파일러는 항상 null, undefined 체크를 해준다. 이때, Non-null assertion operator(!)는 TypeScript에게 해당 속성이 null 일 수 있는 것처럼 보이지만 해당 값은 null이 들어오지 않는다고 확신해준다. optional chaining operator optional chaining operator (?.) 는 체인의 각 참조가 유효한지 명시적으로 검증하지 않고, 연결된 객체 체인 내에 깊숙이 위치한 속성 값을 읽을 수 있다. optional chaining 과 non-null assertion의 차이점 non-null assertion -> null, undefined 일 경..
