함수와 타입
함수 타입
/**
* 함수 타입 정의
*/
// 함수를 설명하는 가장 좋은 방법
// 어떤 매개변수를 받고, 어떤 결과값을 반환하는지 이야기
// 어떤 [타입의] 매개변수를 받고, 어떤 [타입의] 결과값을 반환하는지 이야기
function func(a: number, b: number) {
return a + b;
}
/**
* 화살표 함수의 타입을 정의하는 방법
*/
const add = (a: number, b: number) => a + b;
/**
* 함수의 매개변수
*/
// 기본값을 기준으로 타입 추론
// 필수 매개변수는 선택적 매개변수 뒤에 올 수 없음
function introduce(name = "rachel", age: number, tall?: number) {
console.log(`name: ${name}`);
console.log(`tall: ${tall}`);
}
introduce("rachel", 20, 168);
introduce("rechel", 20);
// 배열 안에 여러 숫자 아래 2가지 방식으로 표현 가능
function getSum1(...rest: [number, number, number]) {
let sum = 0;
rest.forEach((it) => (sum += it));
return sum;
}
getSum1(1, 2, 3);
function getSum2(...rest: number[]) {
let sum = 0;
rest.forEach((it) => (sum += it));
return sum;
}
getSum2(1, 2, 3, 4, 5);
함수 타입 표현식과 호출 시그니쳐
/**
* 함수 타입 표현식
*/
// 타입 별칭 이용 = 함수 타입 표현식(function type expression)
type Operation = (a: number, b: number) => number;
const add: Operation = (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;
/**
* 호출 시그니쳐 = (콜 시그니쳐)
*/
// 함수 타입 표현식과 동일한 기능
// JS 함수도 객체
type Operation2 = {
(a: number, b: number): number;
// 하이브리드 타입
name: string;
};
const add2: Operation2 = (a, b) => a + b;
const sub2: Operation2 = (a, b) => a - b;
const multiply2: Operation2 = (a, b) => a * b;
const divide2: Operation2 = (a, b) => a / b;
함수 타입의 호환성
/**
* 함수 오버로딩
* 하나의 함수를 매개변수의 개수나 타입에 따라
* 여러가지 버전으로 정의하는 방법
* -> 하나의 함수 func
* -> 모든 매개변수의 타입 number
* -> Ver1. 매개변수가 1개 -> 이 매개변수에 20을 곱한 값 출력
* -> Ver2. 매개변수가 3개 -> 이 매개변수들을 다 더한 값을 출력
*/
// 버전들 -> 오버로드 시그니쳐
function func(a: number): void;
function func(a: number, b: number, c: number): void;
// 실제 구현부 -> 구현 시그니쳐
// 모든 오버로드 시그니쳐들이 의미가 있도록 만들어야 함
function func(a: number, b?: number, c?: number) {
if (typeof b === "number" && typeof c === "number") {
console.log(a + b + c);
} else {
console.log(a * 20);
}
}
// func();
func(1);
// func(1, 2);
func(1, 2, 3);
함수 오버로딩
/**
* 함수 오버로딩
* 하나의 함수를 매개변수의 개수나 타입에 따라
* 여러가지 버전으로 정의하는 방법
* -> 하나의 함수 func
* -> 모든 매개변수의 타입 number
* -> Ver1. 매개변수가 1개 -> 이 매개변수에 20을 곱한 값 출력
* -> Ver2. 매개변수가 3개 -> 이 매개변수들을 다 더한 값을 출력
*/
// 버전들 -> 오버로드 시그니쳐
function func(a: number): void;
function func(a: number, b: number, c: number): void;
// 실제 구현부 -> 구현 시그니쳐
// 모든 오버로드 시그니쳐들이 의미가 있도록 만들어야 함
function func(a: number, b?: number, c?: number) {
if (typeof b === "number" && typeof c === "number") {
console.log(a + b + c);
} else {
console.log(a * 20);
}
}
// func();
func(1);
// func(1, 2);
func(1, 2, 3);
사용자 정의 타입 가드
/**
* 사용자 정의 타입 가드
*/
type Dog = {
name: string;
isBark: boolean;
};
type Cat = {
name: string;
isScratch: boolean;
};
type Animal = Dog | Cat;
function isDog(animal: Animal): animal is Dog {
return (animal as Dog).isBark !== undefined;
}
function isCat(animal: Animal): animal is Cat {
return (animal as Cat).isScratch !== undefined;
}
function warning(animal: Animal) {
if (isDog(animal)) {
animal;
} else if (isCat(animal)) {
animal;
}
}
[참고]
한 입 크기로 잘라먹는 타입스크립트
