여기에는 현재 Route 를 알 수 없는 goToRoute 라는 함수가 있습니다.

type Route = unknown

export const goToRoute = (route: Route) => {}

특정 유형의 문자열만 goToRoute 에 전달할 수 있도록 만들려고 합니다.

Challenge

과제는 Route 를 슬래시로 시작하는 모든 문자열을 허용하는 것으로 변경하는 것입니다.

다음은 성공할 수 있는 문자열의 몇 가지 예시입니다.

// Should succeed:
goToRoute("/users")
goToRoute("/")
goToRoute("/admin/users")

이 예제에서는 오류가 발생해야 합니다.

// ®ts-expect-error
goToRoute("users/1")
// @ts—expect—error
goToRoute("<http://facebook.com>")

힌트: 이 문제를 해결하려면 타입스크립트 문서에서 템플릿 리터럴 타입을 확인하세요.

나의 답

type Route = `/${string}`;

export const goToRoute = (route: Route) => {};

// Should succeed:

goToRoute('/users');
goToRoute('/');
goToRoute('/admin/users');

// Should error:

// @ts-expect-error
goToRoute('users/1');
// @ts-expect-error
goToRoute('<http://facebook.com>');

문서를 조금 참고했다.

문자열을 사용한 템플릿 리터럴

타입스크립트의 템플릿 리터럴 구문은 자바스크립트 구문과 유사하지만 그 안에 타입을 넣을 수 있다는 점이 다릅니다.