Spread Operator

🔎 Spread Operator

괄호를 제거해주는 연산자

var array = [1,2,3,4,5];

console.log(array); // [1, 2, 3, 4, 5] 출력
console.log(...array);// 1 2 3 4 5 출력

문자열에 사용할 경우 알파벳 하나하나를 출력해준다.

var string = 'hello';

console.log(...string); // 'h','e','l','l','o'출력

어레이를 합치거나, 복사하는데 자주 사용된다.

//어레이 합치기
var a = [1,2,3];
var b = [4,5];
var c = [...a, ...b]

console.log(c); // [1,2,3,4,5]출력

//어레이 복사
var a = [1,2,3]
var b = [...a]

spread를 이용해 어레이를 만들어주면 서로 값 공유가 일어나지 않는 독립적인 어레이를 만들 수 있다.

//등호를 사용하여 복사
var a = [1,2,3]
var b = a

위의 예제처럼 등호를 사용하여 대입할 경우 값 공유가 일어나기 때문에, 변수 a를 수정하면 b의 값도 변경되는 버그가 발생한다.

🤔 중복값이 있을 경우?

var array1 = { a : 1, b : 2};
var array2 = { a : 3, ...array1 };
console.log(array2); // a : 3, a : 1, b : 2 > 뒤에있는 a:1값이 저장됨

중복값이 있을 경우 뒤에 있는 값으로 저장된다.

🔎 Rest 파라미터

함수에서 파라미터 사용시 파라미터 왼쪽에 ...기호를 붙여주면 해당 자리에 오는 파라미터를 [ ]중괄호로 감싸준다.

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

test(1,2,3,4,5) // [1,2,3,4,5] 출력

파라미터가 여러 개라면 rest는 항상 마지막 파라미터로 넣어야 한다.

function test(a, b, ...rest){
	console.log(rest)
};

test(1,2,3,4,5) // [3,4,5] 출력