스프레드 연산자와 rest 파라미터 차이점

 

스프레드 연산자

 

스프레드 연산자는 es6에서 도입된 문법으로, 배열, 객체, 함수 인자를 개별 요소로 확장할 때 사용된다. 

 

배열이나 객체의 모든 항목을 다른 배열이나 객체에 복사하거나, 배열의 요소를 함수의 인자로 전달도 할 수 있다.

 

또, 스프레드 연산자를 사용하면 코드를 보다 간결하고 가독성 좋게 만들 수 있는 좋은 문법이라 할 수 있다.

 

예시는 다음과 같다.

// 배열에서의 사용
const bodyParts = ["arm", "shoulder"];
const body = ["head", ...bodyParts, "toes"];

// body: ["head", "arm", "shoulder", "toes"];

// 객체에서의 사용
const user = {name: "dominic", age: 31};
const userWithId = {...user, id: 1};

// userWithId: {name: "dominic", age: 31, id: 1};

// 함수에서의 사용
const sum = (x, y, z) => {
	return x + y + z;
}

const numbers = [1, 2, 3];
console.log(sum(numbers));  // 6

 

Rest 파라미터

 

Rest 파라미터는 함수의 파라미터를 배열로 받을 때 사용된다. 함수에 전달된 인자들을 '나머지(rest)'로 묶어 배열을 만든다.

 

이 Rest 파라미터는 주로 함수가 받을 인자의 개수가 정해져 있지 않을 때 유용하다.

 

사용 예는 다음과 같다.

const sum = (...numbers) => {
	return numbers.reduce((num, current) => num + current, 0);
}

console.log(sum(1, 2, 3, 4));  // 10