Typescript 공부 5일차

김가연·2023년 6월 27일
0

TypeScript

목록 보기
6/8

타입스크립트 강의를 보며 개인적으로 기록하는 글입니다.
이번 글에서는 Type Aliases, Function Return Types, void에 대해 다룹니다.

Type Aliases

타입 별칭을 이용하게 되면 기본적인 타입 정의부터 시작해서 커스텀 타입들을 정의할 수 있습니다.

예시

함수의 파라미터를 정의하는 부분에서 input1, input2의 타입이 중복됩니다.
그럴 때에 타입 별칭을 통해 같은 타입임을 나타낼 수 있습니다.

이렇게 type 키워드 뒤에 타입명과 등호 그리고 정의할 유형을 적어주면 됩니다.
물론 숫자와 문자열 이외에도 다 사용 가능합니다.

이렇게 정의한 타입을 통해 코드 어디에서나 재사용이 가능해집니다.
또한 오타도 피하고, 의도를 정확히 알 수 있어 빠른 개발이 가능해집니다.

Function Return Types

함수의 파라미터 타입을 정의했듯이 리턴 타입도 정의가 가능합니다.

매개 변수 다음에 있는 유형이 add 함수의 리턴 타입을 가리킵니다.
코드에서 따로 정의하지 않았지만 반환 값을 타입스크립트가 추론하는 것을 확인할 수 있습니다.

물론 이와 같이 명시적으로 정의해줄 수도 있습니다.
반환 값이 문자열이라고 정의하니 역시 반환문에서 에러로 알려주죠.

그러나, 이전에 얘기한 바와 같이 명시적으로 타입을 정의할 특별한 이유가 없다면 타입스크립트가 타입을 추론하도록 두는 것이 좋습니다.

만약 리턴 값이 없는 함수라면 리턴 타입은 어떻게 되나요?

printResult라는 값을 반환하지 않고 콘솔에 출력만 하는 함수가 있습니다.
add 함수와 마찬가지로 커서를 올리면

리턴 타입이 void라고 나옵니다.

void

void 타입은 함수가 아무것도 리턴하지 않는다는 것을 나타냅니다.
함수의 리턴 타입을 void로 정의한 후 값을 반환하려고 할 경우 에러가 납니다.

자바스크립트의 관점으로 보면 이렇게 이해할 수 있습니다.

그러나 저 코드는 이해를 위한 참고 코드이며, 타입스크립트에선 void 타입을 사용합니다.

profile
프론트엔드 개발자

0개의 댓글