나머지 매개변수

나머지 매개변수

인수를 여러 개 받는 함수라면 그 목록을 배열 형태로 건넬 수 있습니다. 

function sum(numbers: number[]): number {
    return numbers.reduce((total, n) => total + n, 0)
}

sum([2, 4, 6)] // 12로 평가

때로는 인수의 개수가 고정된 고정 인자 API가 아니라 인수의 개수가 달라질 수 있는 가변 인자 API가 필요할 때도 있습니다. 

 

전통적으로 JavaScript는 마법 같은 arguments 객체를 통해 해당 기능을 제공했습니다.

 

JavaScript 런타임이 함수에 자동으로 arguments를 정의해 개발자가 함수로 전달한 인수 목록을 할당한다는 점은 마법 같은 일입니다.

 

arguments는 일종의 순수한 배열이 아니므로, .reduce 같은 내장 함수 기능을 사용하려면 먼저 진짜 배열로 변환해야 합니다.

function sumVariadic(): number{
    return Array
        .from(arguments)
        .reduce((total, n) => total + n, 0)
}

sumVariadic(2, 4, 6) // 12로 평가

하지만 arguments엔 한 가지 큰 문제가 있는데, 전혀 안전하지 않다는 점입니다.

 

텍스트 편집기에서 total과 n 위로 마우스를 가져가면, TypeScript가 n과 total 모두를 any 타입으로 추론한 것을 알 수 있습니다.

 

sumVariadic을 실제로 사용할 때까진 문제가 드러나지 않습니다.

sumVariadic(2, 4, 6) // error TS2554: 0개의 인수가 필요한데 3개의 인수가 제공됨

sumVariadic이 인수를 받지 않도록 선언했으므로 해당 함수를 호출하면, TypeScript 입장에선 인수를 받을 수 없다면서 TypeError를 발생시킵니다.

 

안전한 타입의 가변 인수 함수를 만들려면, 나머지 매개변수(rest parameter)를 사용하면 됩니다.

 

안전하지 않은 arguments를 사용하는 대신에 나머지 매개변수를 사용하여 sum함수가 안전하게 임의의 인수를 받게 만들면 됩니다.

function sumVariadicSafe(...numbers: number[]): number {
    return numbers.reduce((total, n) => total + n, 0)
}

sumVariadicSafe(2, 4, 6) // 12로 평가

기존 함수와 달라진 부분은 sum함수의 매개변수 목록에 ...이 추가되었다는 점뿐이지만, 이 덕분에 타입 안전성을 갖춘 함수가 만들어졌습니다.

 

함수는 최대 한 개의 나머지 변수를 가질 수 있으며, 나머지 매개변수는 함수의 매개변수 목록 맨 마지막에 위치해야 합니다.