Quiz 1
- 다음 요구사항을 만족하도록 introduce 함수의 매개변수의 타입을 정의하세요
- name 매개변수는 String 타입이며, "이정환" 이라는 기본값이 설정됩니다.
- tall 매개변수는 Number 타입이며, 선택적 매개변수 입니다.
Answer 1
function introduce(name = "치현", tall?: number) {
if (!tall) {
console.log(`안녕하세요 ${name}입니다!`);
} else {
console.log(`안녕하세요 ${name}입니다. 키는 ${tall}입니다`);
}
}
Quiz 2
- 함수 타입 표현식을 이용해 다음 요구사항을 만족하는 타입 Func를 정의하세요
- 2개의 매개변수 a와 b를 받습니다.
- 매개변수 a는 Number, b는 String 타입입니다.
- 반환값 타입은 boolean 입니다.
Answer2
type Func = (a: number, b: string) => boolean;
배운 개념 정리
함수 타입
필요성
- 함수를 설명하는 가장 좋은 방법
- 어떤 매개변수를 받고, 어떤 결과를 반환하는 이야기
- 어떤 타입의 매개변수를 받고, 어떤 타입의 결과를 반환하는지 이야기
사용법
// 기본형
function func(a: number, b: number) {
return a + b;
}
// 화살표 함수 타입
const add = (a: number, b: number) => a + b;
// 매개변수 포함
// Ex1
function introduce(name = "치현", age: number, tall?: number) {
console.log(`name: ${name}`);
console.log(`age: ${age}`);
if (typeof tall === "number") console.log(`tall: ${tall + 10}`);
}
introduce("치현", 29);
// Ex2
function getSum(...rest: number[]) {
let sum = 0;
rest.forEach((n) => (sum += n));
return sum;
}
getSum(1, 2, 3);
// 인자 개수 지정도 가능
function getSum1(...rest: [number, number, number]) {
let sum = 0;
rest.forEach((n) => (sum += n));
return sum;
}
getSum1(1, 2, 3, 4, 5, 6, 7, 8, 9, 10) // Error: 인자는 3개가 예상되지만, 10개가 들어왔다.
함수타입 표현식
정의
함수의 인자와 반환 값의 타입을 정의하는 방식
사용법
type Operation = (a: number, b: number) => number;
const add: (a: number, b: number) => number = (a, b) => a + b;
const sub: Operation = (a, b) => a - b;
const multiply: Operation = (a, b) => a * b;
const divide: Operation = (a, b) => a / b;
호출 시그니처(콜 시그니처)
함수 타입 표현식과 유사하나, 객체의 프로퍼티처럼 사용될 수 있다
정의
마치 객체의 프로퍼티처럼 생겼지만, 함수의 타입을 정의하는 것
사용법
type Operation1 = {
(a: number, b: number): number;
name: string;
};
const add1: Operation1 = (a, b) => a + b;
const sub1: Operation1 = (a, b) => a - b;
const multiply1: Operation1 = (a, b) => a * b;
const divide1: Operation1 = (a, b) => a / b;
함수 타입의 호환성
정의
특정 함수 타입을 다른 함수 타입으로 취급해도 괜찮은가를 판단하는 기준
기준 1: 반환값의 타입이 호환되는가
type A = () => number;
type B = () => 10;
let a: A = () => 10;
let b: B = () => 10;
a = b;
b = a; // Error: 다운캐스팅 불가능. A 타입은 B 타입으로 할당할 수 없다. 'number' 타입은 '10' 형식에 할당할 수 없다.
기준 2: 매개변수가 호환되는가
// 2-1 매개변수의 개수가 같을 때.
type C = (value: number) => void;
type D = (value: 10) => void;
let c: C = (value) => {};
let d: D = (value) => {};
c = d; // Error: 업캐스팅 불가능. D 형식은 C 형식에 할당할 수 없다. 'value' 및 'value'의 매개변수 형식이 호환되지 않는다.
d = c;
// 2-2 매개변수의 개수가 다를 때.
type Func1 = (a: number, b: number) => void;
type Func2 = (a: number) => void;
let func1: Func1 = (a, b) => {};
let func2: Func2 = (a) => {};
func1 = func2;
func2 = func1; // Error: Func1 형식은 Func2 형식에 할당할 수 없다. 'b' 매개변수가 필요하고 'Func2' 형식은 '1'개의 매개변수만 허용한다.