👩🏻💻 정리/TypeScript
[TypeScript] 함수의 타입 정의
Bohyun
2021. 9. 15. 23:33
목차
1. 함수 정의
1.1 함수 선언식
1.2 화살표 함수
2. 다양한 매개변수 타입
1. 함수 정의
타입스크립트에서는 함수의 타입을 정의해줘야 한다.
1.1 함수 선언식
함수 선언식의 타입 정의는 아래와 같다.
function formatDate(d: Date): string { 1️⃣, 2️⃣
let year = d.getFullYear();
let month = d.getMonth() + 1;
let day = d.getDate();
return `${year}년 ${month}월 ${day}일`
}
const today = formatDate(new Date());
1️⃣ 매개변수의 우측에 콜론과 매개변수의 타입을 정의한다. → formatDate(d: Date)
2️⃣ return 값의 타입은 소괄호 우측에 타입을 정의한다. → formatDate(): string {}
⇒ 즉, formatDate의 매개변수 d는 Date 객체 타입을 받아야 하고, return 값은 문자열이어야 한다.
1.2 화살표 함수
화살표 함수도 동일하다.
const formatDate = (d: Date): string => {
const year = d.getFullYear();
const month = d.getMonth() + 1;
const day = d.getDate();
return `${year}년 ${month}월 ${day}일`;
};
const today = formatDate(new Date());
2. 다양한 매개변수 타입
아래와 같이 매개변수의 타입을 여러 개로 복잡하게 받을 수도 있다.
let formatDate = (d: Date | number, lang = "ko", delimiter?: string): string => { 1️⃣, 2️⃣, 3️⃣
// 로직 생략
};
formatDate(new Date());
formatDate(20201028, "en");
formatDate(20201028, "en", "-");
1️⃣ 첫 번째 매개변수 d는 Date 객체 타입 혹은 number로 타입을 정의한다. → (d: Date | number)
2️⃣ 두 번째 매개변수 lang은 전달되는 인자가 없을 시, "ko"라는 문자열의 값이 기본적으로 할당된다. → (lang = "ko")
3️⃣ 세 번째 매개변수 delimiter는 물음표를 사용하여 선택적으로 인자를 전달한다. → (delimiter?: string)