(TypeScript) - 함수 타입

■ 함수 타입

// 함수를 설명하는 가장 좋은 방법
// 어떤 매개변수를 받고, 어떤 결과값을 반환하는지 이야기
// 어떤 [타입의] 매개변수를 받고, 어떤 [타입의] 결과값을 반환하는지 이야기
function func(a: number, b: number) {
    return a + b;
}

 

함수란 매개변수를 받아서 어떤 연산들을 함수 내부에 거쳐서 결과값을 도출하는 것이다.

 

즉 타입스크립트에서는 어떤 [타입의] 매개변수를 받고, 어떤 [타입의] 결과값을 반환하는지 이야기하는 것이다.

따라서 다음 코드와 같이 a 와 b 매개변수에 타입을 넣어주면 반환값은 자동으로 number 로 추론하게 된다.

 

• 화살표 함수 타입

/**
 * 화살표 함수의 타입을 정의하는 방법
 */

const add = (a: number, b: number) => a + b;

 

화살표 함수도 함수 정의식과 동일하게 정의해주면 된다.

 

• 함수의 매개변수

/**
 * 함수의 매개변수
 */

function introduce(name = '이정환') {
    console.log(`name: ${name}`);
}

 

함수의 매개변수를 전달할 때는 만약 기본값을 전달했을 경우

해당 타입을 정의할 때는 기본값과 동일한 타입을 설정해야 한다.

 

다음 기본값은 string 으로 타입값도 string 이 되어야 한다.

 

/**
 * 함수의 매개변수
 */

function introduce(name = '송송송', tall?: number) {
    console.log(`name: ${name}`);
    console.log(`tall: ${tall}`);
}

introduce('송송송', 175);
introduce('송송송');

 

만약 매개변수를 선택적으로 받고 싶다면

매개변수에 ? 를 붙여 선택적 매개 변수를 받으면 된다.

 

function introduce(name = '송송송', tall?: number) {
    console.log(`name: ${name}`);
    if (typeof tall === 'number') {
        console.log(`tall: ${tall + 10}`);
    }
}

 

tall 값을 ? 로 받으면 올 수 있는 타입이 number 와 undefined 임으로

tall 에 +10을 하는 것을 쓰고 싶다면 타입 좁히기를 통해 해당 값이 number 일때만 작동하게 제한해줘야 한다.

 

function introduce(name = '송송송', tall?: number) {

 

선택적 매개변수는 필수 매개변수 앞에 오면 안된다.

생략하면 안되는 매개변수를 필수 매개변수라 하는데 여기서는 name 이 그에 해당한다.

필수 매개변수가 선택적 매개변수보다 뒤에 있으면 오류가 발생한다.

 

• rest 파라미터

rest 문법

: 가변적인 길이의 인수들을 전달을 하면 이를 배열로 묶어서 rest 라는 변수에 저장할 수 있도록 도와주는 문법

 

// 레스트 파라미터
// 가변적인 길이의 인수들을 전달을 하면 이를 배열로 묶어서 rest 라는 변수에 저장할 수 있도록 도와주는 문법
function getSum(...rest: number[]) {
    let sum = 0;
    rest.forEach((it) => (sum += it));

    return sum;
}

getSum(1, 2, 3); //6
getSum(1, 2, 3, 4, 5); //15

 

getSum 에서는 number 배열 타입으로 받고 있기 때문에 rest 파라미터 타입을 number [] 로 설정해주면 된다.

 

function getSum(...rest: number[number, number, number]) {
    let sum = 0;
    rest.forEach((it) => (sum += it));

    return sum;
}

getSum(1, 2, 3); //가능
getSum(1, 2, 3, 4, 5); //불가능

 

만약 매개변수의 값을 정하고 싶다면

배열 안에 [number, number, number] 와 같이 튜플 형태로 만들어 주면 된다.