TypeScript 5.5 릴리즈

TypeScript 5.5가 출시되었습니다. 주목해 볼만한 변경점을 정리해 보았습니다.


## 1. Inferred Type Predicates

함수가 반환할 타입을 좀 더 똑똑하게 추리합니다. 덕분에 불필요한 타입 단언 없이 타입을 좁힐 수 있게 되었습니다. 특히 filter 등의 함수에서 유용해보입니다.

type Item = string | number | null;

const items: Item[] = ["a", 1, null, "b", 2, null, "c"];
const nonNullItems = items.filter(item => item !== null);

// 5.5 미만: Item[]
// 5.5 이상: (string | number)
nonNullItems.forEach(item => console.log(item.toString()));
// 5.5 미만: .toString()에서 'item' is possibly 'null' 타입 에러 발생
// 5.5 이상: 오류 없음


## 2. tsconfig에 ${configDir} 추가

TypeScript 5.5에 새로운 템플릿 변수 ${configDir}가 생겼습니다. 이 변수는 tsconfig.base.json을 여러 컨피그에서 extends로 확장하는 경우에 유용합니다. 특히 모노레포에서 유용할 것으로 보입니다.

{
  "compilerOptions": {
    "typeRoots": [
      "./node_modules/@types"
      "./custom-types"
    ],
    "outDir": "dist"
  }
}

tsconfig.base.json을 아래와 같이 수정하면 어떻게 될까요?

{
  "compilerOptions": {
    "typeRoots": [
      "${configDir}/node_modules/@types"
      "${configDir}/custom-types"
    ],
    "outDir": "${configDir}/dist"
  }
}

이제 프로젝트에서 이 파일을 확장할 때, 경로의 기준이 tsconfig.base.json 파일이 아니라 파생된 tsconfig.json에 상대적인 경로가 됩니다. 이렇게 하면 프로젝트 간에 컨피그 설정 공유가 더 쉬워집니다.


## 3. 정규식 문법 검사

이제 TypeScript가 정규식에 대해 기본적인 구문 검사를 수행합니다. 정규식은 특히 글자 하나 차이로 실수할 여지가 큰데, 실수 방지에 큰 도움이 될 것 같습니다.

let myRegex = /@robot(\s+(please|immediately)))? do some task/;\
// ~
// 오류!
// Unexpected ')'. Did you mean to escape it with backslash?


## 4. Control Flow Narrowing for Constant Indexed Accesses

이전에는 obj[key]와 같은 형태로 객체의 속성에 접근할 때, TypeScript가 그 속성의 정확한 타입을 알아내기 어려웠습니다.

TypeScript 5.5에서는 objkey가 변경되지 않는 경우(즉, 상수로 취급될 수 있는 경우), 타입 체크 이후에 해당 속성의 타입을 더 구체적으로 좁힐 수 있게 되었습니다.

function f1(obj: Record<string, unknown>, key: string) {
  if (typeof obj[key] === "string") {
    // 이제 정상 동작, 이전에는 에러였음
    obj[key].toUpperCase();
  }
}

예제 코드는 객체나 키가 변하지 않으므로 typeof 검사 이후 obj[key] 타입을 string으로 좁힐 수 있습니다.


## 5. 성능 향상

  • 벤치마크 결과, 빌드 시간이 5~8% 빨라지고 언어 서비스 작업 속도가 10~20% 빨라졌다고 합니다.

  • transpileModule API 성능이 2배 이상 빨라졌습니다.

  • TypeScript 패키지 크기가 33% 정도 감소했습니다.


https://www.typescriptlang.org/docs/handbook/release-notes/typescript-5-5.html

Documentation - TypeScript 5.5

typescriptlang.org

Documentation - TypeScript 5.5

다음 내용이 궁금하다면?

또는

이미 회원이신가요?

2024년 6월 27일 오전 9:48

 • 

저장 34조회 2,075

댓글 2