[JavaScript] Spread와 Rest

이번 글은 Spread와 Rest에 대한 글이다.

 

---

 

 

[ Spread 연산자 ]

Spread는 객체나 배열에 저장된 여러 개의 값을 개별로 흩뿌려주는 역할을 한다.

배열에서 사용하는 경우 형태는 아래 코드와 같이 배열명 앞에 ...을 붙여준다.

그 후 출력되는 것을 보면 arr1과 arr2가 합쳐진 것을 확인할 수 있다.

let arr1 = [1, 2, 3];
let arr2 = [4, ...arr1, 5];
console.log(arr2);

결과값

 

객체도 마찬가지로 객체명 앞에 ...을 붙여주는 형태이고 객체 obj1과 객체 obj2가 합쳐진 것을 확인할 수 있다.

let obj1 = {
  a: 1,
  b: 2,
};
let obj2 = {
  ...obj1,
  C: 3,
};

console.log(obj2);

 

 

---

 

 

[ Rest 매개변수 ]

배열의 형태로 한번에 받아와서 함수를 호출하여 전달할 모든 인수를 배열로 만들어준다.

spread와 이름 앞에 ...이 붙는 형태는 같지만 rest는 반드시 매개변수에서만 사용되므로 둘은 다른 것이다.ㅁ

function funcB(...rest) {
    console.log(rest);
}                           

funcB(...arr1);

결과값

 

아래 코드와 같은 형태로도 작성이 가능한데 아래 코드의 경우 첫번째 배열 값이 변수 one에 들어가고 나머지들은 ...rest에 할당되게 된다.

rest 뒤에 변수를 추가 선언하는 것은 불가능하다.

funcB(one, ...rest) {}

 

 

---