Typescript 공부 6일차

김가연·2023년 6월 28일
0

TypeScript

목록 보기
7/8

타입스크립트 강의를 보며 개인적으로 기록하는 글입니다.
이번 글에서는 여러 가지의 Fuction Types에 대해 다룹니다.

Fuction Types

Fuction 타입은 매개변수와 그 함수의 반환 값에 관한 함수를 설명하는 유형입니다.

combineValues라는 변수에 add 함수를 할당하고 호출하는데 에러가 발생하게 됩니다. 값이 중간에 5로 바뀌었기 때문에 발생한 에러이죠. 해당 변수의 타입이 any여서 타입스크립트가 체크를 하지 않았기 때문입니다.

이렇게 function 타입이라고 명시해주니 잘 동작합니다.

그렇다면 반환 값이나 매개 변수가 다른 함수를 넣는다면 이것도 타입스크립트가 알려줄까요??

아닙니다.

function이라고 정의한 것은 이 변수에는 함수를 저장한다의 의미입니다.
즉, 지금 코드에서 타입스크립트는 그 이외의 것들에 대해 알려줄 수 없는 것입니다.

그래서 combineValues의 타입을 수정해봤습니다. 화살표 함수처럼 명시해주면 됩니다.

괄호 안에 파라미터의 타입 (a: number, b: number)
그리고 화살표 뒤에 리턴 타입 number

를 적어주니 이제 타입이 다른 함수인 printResult를 할당하면 에러가 납니다.

이외에도 다른 함수 예제들이 있습니다.

이번 함수는 넘겨받은 두 개의 숫자를 더하고, 그 값을 콜백 함수로 넘기는 함수입니다. 이 때, 콜백 함수의 매개변수는 숫자일 테고, 반환 값이 없으니 void 타입입니다.

콜백 함수의 매개변수를 추가하니 에러가 납니다.
그럼 리턴 타입이 void이니 리턴 값이 있을 때에도 에러가 날 것이 분명합니다.

정답은 아니오입니다.
콜백 형식에서 void를 지정함으로써 여기서 반환하는 값이 무엇이 됐든 무시하겠다는 것을 나타내는 것입니다. 즉, addAndHandle 함수에서는 콜백 함수의 리턴 값으로 아무것도 하지 않는다는 말이죠.

타입스크립트는 이런 식으로 여러 타입들을 다양하게 조합하여 사용할 수 있습니다.

profile
프론트엔드 개발자

0개의 댓글