ES6 문법 배워보기 (파라미터 기본값, Rest 파라미터, Spread 연산자)

이번 포스트는 ES6에서 추가된 파라미터 기본값, Rest 파라미터, Spread 연산, Rest/Spread 프로퍼티에 대해

차례대로 알아보는 시간을 갖도록 하겠습니다. 

1. 파라미터 기본값 ( Default Parameter Value )

 

첫번째 파라미터 기본값은 코드로 보는게 편할것 같습니다. 

// ES5

function plus(x, y) {
    x = x || 0;   // 매개변수 x에 인수를 할당하지 않으면 기본값으로 0을 할당한다
    y = y || 0;   // 매개변수 x에 인수를 할당하지 않으면 기본값으로 0을 할당한다

    return x + y;
}

console.log(plus());        // 0
console.log(plus(1, 2));    // 3


// ES6

function plus(x = 0, y = 0) {    // 파라미터 x, y에 인수를 할당하지 않으면 기본값으로 0을 할당한다
    return x + y 
}
console.log(plus());        // 0
console.log(plus(1, 2));    // 3

ES6 부터는 함수 내에서 파라미터 기본값을 할당할수 있게 되었습니다.

2. Rest 파리미터

Rest 파라미터(Rest Parameter)는 Spread연산자(...)를 사용하여 파라미터를 정의한 것을 말한다.

Rest 파라미터를 사용하면 인수의 리스트를 함수 내부 에서 배열로 전달 받는다.

// ES6

function prt(...rest) {                     // 인자가 몇개가 오던 배열로 받는다.
    for(let i = 0; i <= rest.length; i++) { // rest를 for문으로 출력해본다
        console.log(rest[i])                // 다음 포스트에서는 ES6에 추가된 for of문을 배우면 좀더 간결하고 쉽게 
    }                                       // 배열 데이터를 확인할수 있다.

    console.log(Array.isArray(rest))        // rest가 배열로 선언이 되어 true를 반환한다.
}

- Rest 파라미터 앞으로 다른 인자가 들어올수 있으며 값은 차례대로 할당된다. 

- Rest 파라미터는 가장 마지막에 선언되어야 한다. (그렇지 않으면 오류를 뱉는다.)

3. Spread 연산자

앞서 본 ...는 Spread 연산자이다.

Spread 연산자는 Rest 파라미터로 사용하면 인자들을 합쳐서 배열로 만들어주지만 

반대로 배열을 넣어주면 배열을 분리 해준다.

// ES6

function plus(...arr) {
    return arr
}

let a = plus(1,2,3,4,5)

console.log(a)             // [1, 2, 3, 4, 5]
console.log(...a)          // 1 2 3 4 5

ES5 에서는 apply 메소드를 이용해서 배열을 분해 했지만 

ES6 에서는 간단하게 Spread 연산자를 이용해서 배열 분해가 가능하다.