TypeScript에서 제네릭의 제약 조건

이전 강의 중 하나에서 우리는 전달된 매개변수의 길이를 출력해야 하는 제네릭 타입 함수를 만들었습니다. 그러나 컴파일 시 모든 타입이 길이를 가질 수 있는 것은 아니기 때문에 오류가 발생했습니다:

function myFunc < T > (data: T): T {
	console.log(data.length); // 오류
	return data;
}

그때 우리는 제네릭 타입을 제네릭 배열 타입으로 변경하여 상황을 수정했습니다. 하지만 TypeScript에서는 제네릭에 제약 조건을 생성하는 기능이 있습니다. 이를 위해 꺾쇠 괄호 안에, 변수 T 뒤에 키워드 extends를 작성합니다. 그 뒤에 중괄호 안에 문자열 타입의 새 변수 str를 작성합니다. 함수의 나머지 코드는 변경 없이 유지됩니다:

function myFunc <T extends {str: string}> (data: T): void {
	console.log(data.str.length);
}

결과적으로, 제네릭 타입은 중괄호 안에 지정된 변수 str의 타입을 상속합니다. 이제 우리 함수의 동작을 확인해 보고 타입 str를 참조하는 변수 myStr를 생성한 후 중괄호 안에 값을 할당해 봅시다:

let myStr: {str: string} = {str: 'abcde'};

함수 myFunc를 호출해 보겠습니다. 다시 그 타입을 지정하는 것을 잊지 말고 매개변수로 변수 myStr를 전달합니다:

myFunc <{str: string}> (myStr);

강의에서 살펴본 예제를 바탕으로, 숫자 배열의 길이를 찾는 함수를 작성해 보세요.