본문 바로가기
반응형

typescript7

실제 작동하는 Javascript를 무겁게 만드는 enum과 그 대안 : as const를 활용한 객체 Typescript에서 Javascript으로 변환되는 과정 TS를 컴파일하여 JS를 만드는데, 이 컴파일 과정에서 타입스크립트는 타입체크를 하게 된다. 컴파일과정에서 타입체크가 끝나면 타입과 타입연산자는 제거되면서 런타임과 런타임 성능에 영향을 주지 않는다. 그런데 enum의 경우 TS에서 자체 제공하는 기능이고 JS에서는 없는 개념이다. 컴파일과정에서 JS에 없는 enum을 구현하기 위해 타입체크를 위한 추가 코드를 생성한다. ( 참고 ) 그리고 이렇게 만들어진 추가 코드는 타입이 아니기 때문에 제거되지 않은채로 js로 변환된다. 즉, 어플리케이션 로직에는 영향을 주지 않는 오로지 타입체크만을 위한 JS코드가 생기게 되는 것이다 -> 불필요한 코드를 생성한 후 어플리케이션이 실행됨 const enum.. 2023. 2. 19.
번역 : The Purpose of 'declare' Keyword in TypeScript declare를 명확하게 알고있지 않아서 검색하다가 이 글 을 번역하였다. (이 글에서의 declare사용은 구글맵을 예시로 하고 있지만, 카카오맵을 타입스크립트+리액트에서 사용할 때에도 적용할 수 있다.) 원문 : https://javascript.plainenglish.io/purpose-of-declare-keyword-in-typescript-8431d9db2b10 Purpose of Declare Keyword in TypeScript A Detailed Introduction to the Role of TypeScript Declare, so You Are Not a Stranger to *.d.ts Files. javascript.plainenglish.io 아래의 글은 위 원문을 번역한 글.. 2022. 12. 4.
typeof로 object를 구분할 수 없을때 narrowing 하는 방법 : IN 연산자 다음과 같은 경우에는 어떤 에러가 뜰까?? type Korea = { 독도: string }; type Japan = { 후지산: string }; function nationFunction(nation: Korea | Japan) { console.log(nation.독도); } nationFunction({ 독도: "는 우리땅" }); Japan에 '독도' 속성이 없기 때문에, 에러가 발생한다. 이를 해결하기 위해 narrowing을 해야 하는데, typeof의 결과는 number, string, object, array 등이다. Korea, Japan은 typeof에 해당하지 않는다. 그렇다면 어떻게 해야할까?? Korea와 Japan에 공통되지 않는 속성을 골라서 in을 사용한다. 다음과 같은 결.. 2022. 1. 19.
타입스크립트 : rest파라미터의 타입 rest파라미터 함수의 파라미터의 개수가 가변적일때(백만개여도 상관없음), rest 파라미터를 사용할 수 있다. rest파라미터를 사용하면 파라미터를 배열의 형태로 받게 된다. function restParameterFunc(...rest:number[]){ console.log(rest) } restParameterFunc(1,2,3,4,5,6,7,8,9,10) rest파라미터는 파라미터를 배열로 받기 때문에, 타입도 배열이다. 위에서 number형으로 작성했지만, 타입은 배열이다. 2022. 1. 18.
반응형

티스토리툴바