104%

Unknown과 any 두 타입 모두 타입을 지정하기 애매할때 사용한다. 두 타입의 차이점은 뭔지 궁금해서 찾아보았다. 아래 예시를 보자. function prettyPrint(x: unknown): string { if (Array.isArray(x)) { return "[" + x.map(prettyPrint).join(", ") + "]" } if (typeof x === "string") { return `"${x}"` } if (typeof x === "number") { return String(x) } return "etc." } x라는 parameter는 unknown타입이다. 따라서 x에는 모든 타입이 올 수 있다. 그리고 나서 함수 내부에서 x의 타입을 좁혀서 사용하면 된다. 물론 x가..

위 그림에서 never는 아주 작은 점, unknown은 전체를 포함하고 있다는것을 잘 기억하자. unknown 다른 모든 타입들의 슈퍼셋이다. 모든 타입들은 unknown타입이다. never 다른 모든 타입들의 서브셋이다. 가장 최하위 개념의 타입이다. 따라서, 그 어떤 다른 타입들도 never타입일 수 없다. never는 never그 자체다. T | never ⇒ T never는 그 어떤 타입도 아니기 때문에 union을 하더라도 그대로다. T & unknown ⇒ T unknown은 모든 타입들의 superset이기 때문에 unknown과 어떤 타입 T를 교집합하면 그대로 T가 나온다. never로 타입 추론 예외를 제거하자. type Arguments = T extends (...args: inf..

타입스크립트로 리액트 코드를 작성하다보면 컴포넌트의 타입을 정해줘야하는데 너무 여러가지 타입이 있어서 헷갈려서 정리하고자 합니다. 배경지식 클래스형 컴포넌트는 render메소드에서 ReactNode를 리턴한다. 함수형 컴포넌트는 ReactElement를 리턴한다. JSX는 바벨에 의해서 React.createElement(component, props, ...children) 함수로 트랜스파일된다. html 처럼 생긴 문법을 리액트 라이브러리의 렌더링 함수로 변환하는것이다. 그래서 JSX를 사용하지 않고도 리액트를 사용할 수 있으나(JSX없이 사용하는 React) 이렇게 하면 매우 불편하다. // jsx Hello {this.props.toWhat} JSX는 아래 처럼 변경된다. // transpile ..

interface 타입과 객체 자체에 대한 type 별칭은 많은 점이 비슷하지만, type 별칭보다 더 많은 것을 할 수 있기에 interface를 사용하는 것을 일반적으로 권장합니다. interface는 같은 이름으로 여러 번 선언을 해도 컴파일 시점에서 합쳐지기 때문에 확장성이 좋다. 따라서 일반적으로는 interface를 사용하고 union, tuple 등이 필요한 경우에만 type 별칭을 사용하라는 TypeScript Handbook의 내용은 현재에도 유효하다. -> 예를들어, A.tsx 파일에서 interface test { str1: '1' } B.tsx 파일에서 interface test { str2: '2' } 똑같은 이름의 인터페이스를 중복으로 선언하면 프로젝트가 컴파일 될때 아래와 같이..