Spread와 Rest 연산자
실제로 점 3개(...)로 이뤄진 연산자로 Spread 연산자는 배열의 원소나 객체의 property를 나누는 데 사용된다.
Spread 연산자
간단하게 말하면 배열이나 객체를 펼쳐 놓는 것으로 이해할 수 있다.
const newArray = [...oldArray, 1, 2]
const newObject = {...oldObject, newProp:5 }위의 예제를 보면, oldArray 배열에 있는 모든 원소들을 새로운 배열 newArray에 추가하고 1, 2를 더 추가하는 경우이다.
이 경우에 oldArray 앞에는 점 3개(...)가 있으며, 모든 원소를 꺼내서 대괄호로 생성한 새로운 배열에 추가한다는 의미이다.
이와 마찬가지로 객체도 ...oldObject로 모든 property와 값들을 새 객체에 추가한다.
만일 oldObject의 newProp라는 값이 있다면, 5로 새로 덮어씌여질 것이다.
Rest 연산자
같은 점 3개(...)를 사용하지만 약간 다르게 사용된다.
함수의 parameter에서 쓰이며 이후 등장하는 parameter들을 배열로 합치는 데 사용된다.
function sortArgs(...args){
return args.sort() ;
}
const filter = (...args) => {
return args.filter(el => el === 1) ;
}- 함수 정의에서는 하나의 Rest 연산자만 사용할 수 있다.
- Rest 연산자는 반드시 함수 정의 마지막에 존재하는 parameter여야 한다.
// 사용 불가능한 코드
function foo(...one, ...wrong, ...wrong){}
function foo(...wrong, arg2, arg3){}
// 가능한 코드
function foo(arg1, arg2, ...correct){}