🔥🔥 Typescript 새 버전 기능

TypeScript는 Microsoft에서 개발하고 유지 관리하는 프로그래밍 언어입니다. JavaScript의 엄격한 구문 상위 집합이며 선택적인 정적 유형 지정을 언어에 추가합니다.

Typescript는 2021년 4월 1일에 베타 버전 4.3을 발표했습니다. 이 버전을 설치하려면 다음 명령을 사용할 수 있습니다.
npm install typescript@beta
템플릿 문자열 유형 개선 사항
새 버전은 상황에 따라 유형이 지정된 템플릿 리터럴 표현식에 대한 템플릿 리터럴 유형을 도입합니다. 이로 인해 템플릿 리터럴 대상 유형을 유추할 때 TypeScript는 이제 소스 유형이 템플릿 리터럴 유형이 되도록 허용합니다.

다음은 개선된 할당 관계의 몇 가지 예입니다.

type Color = "red" | "blue";
type Quantity = "one" | "two";

type SeussFish = `${Quantity | Color} fish`;
// same as
//  type SeussFish = "one fish" | "two fish"
//         | "red fish" | "blue fish";
…or match patterns of other string-like types.

declare let s1: `${number}-${number}-${number}`;
declare let s2: `1-2-3`;

// Works!
s1 = s2;

항상 진실한 약속 확인
조건문에서 기다리는 누락에 대한 오류 발생에 대한 지원이 추가되었습니다.



정적 인덱스 서명
인덱스 서명을 사용하면 유형이 명시적으로 선언하는 것보다 더 많은 속성을 값에 설정할 수 있습니다. 최신 버전의 색인 서명은 이제 정적으로 선언될 수 있습니다.

수입 명세서 완성
개선된 자동 가져오기 문, 더 쉽고 안정적임, 사용자가 경로가 없는 가져오기 문 작성을 시작하면 TypeScript가 가능한 가져오기 목록을 제공합니다. 사용자가 완료를 커밋하면 사용자가 작성하려는 경로를 포함하여 전체 가져오기 문을 완료합니다.

다음은 최신 버전의 TypeScript를 사용한 자동 가져오기의 예입니다.

태그에 대한 편집기 지원
TypeScript는 이제 태그를 이해할 수 있으며 연결된 선언을 해결하려고 시도합니다. 이것이 의미하는 바는 태그 내의 이름 위로 마우스를 가져가 빠른 정보를 얻거나 go-to-definition 또는 find-all-references와 같은 명령을 사용할 수 있다는 것입니다.

예를 들어, 아래 예에서 bar in bar 정의로 이동할 수 있으며 TypeScript 지원 편집기는 bar의 함수 선언으로 이동합니다.

/**
 * This function depends on {@link bar}
 */
function foo() {

}

function bar() {

}

공용체 열거형은 임의의 숫자와 비교할 수 없습니다.
특정 열거형에 대한 해결된 문제는 구성원이 자동으로 채워지거나 사소하게 작성된 경우 통합 열거형으로 간주됩니다. 이러한 경우 열거형은 잠재적으로 나타내는 각 값을 호출할 수 있습니다.

새 버전에서는 유니온 열거형이 있는 변수가 절대 같을 수 없는 숫자 리터럴과 비교되면 유형 검사기에서 오류가 발생합니다.

enum E {
 A = 0,
 B = 1,
}

function doSomething(x: E) {
 // Error! This condition will always return 'false' since the types 'E' and '-1' have no overlap.
 if (x === -1) {
  // ...
 }
}

//As a workaround, you can re-write an annotation to include the appropriate literal type.

// Include -1 in the type, if we're really certain that -1 can come through.
function doSomething(x: E | -1) {
 if (x === -1) {
  // ...
 }
}


//You can also use a type-assertion on the value.
function doSomething(x: E) {
 // Use a type asertion on 'x' because we know we're not actually just dealing with values from 'E'.
 if ((x as number) === -1) {
  // ...
 }
}

또는 열거형을 다시 선언하여 중요하지 않은 이니셜라이저를 사용하여 모든 숫자를 해당 열거형에 할당할 수 있고 비교할 수 있도록 할 수 있습니다. enum이 몇 가지 잘 알려진 값을 지정하려는 경우 유용할 수 있습니다.

enum E {
 // the leading + on 0 opts TypeScript out of inferring a union enum.
 A = +0,
 B = 1,
}

전체 기사를 읽고 싶다면 여기에서 체크아웃할 수 있습니다.

행복한 코딩!

자세한 내용은 여기에서 기사를 확인하세요:- Typescript New Version Features