[JS] Spread Operator

📌 ES6 Spread Operator

괄호제거 해주는 연산자

var 어레이 = ['hello', 'world'];
console.log(어레이);
console.log(...어레이);

👉 hello world

Array 합치기/복사

var a = [1,2,3];
var b = [4,5];
var c = [...a, ...b];
console.log(c);

👉 (5) [1, 2, 3, 4, 5]

❗ 주의

var a = [1,2,3];
var b = a;
console.log(a);
console.log(b);

이렇게 복사를 하면 a와 b 변수는 [1,2,3]을 각각 따로 하나씩 가진게 아니라 값 공유가 일어남.
그래서 a array를 수정하면 b도 똑같이 바뀌어 버림.

등호를 쓰면 값을 복사한게 아니라 [1,2,3] 값이 저기 있다고 가리키는 화살표를 복사한 것.

그래서 값을 공유하지 않고 각각 독립적인 값을 저장하도록 array를 복사하려면 spread를 이용하자.

var a = [1,2,3];
var b = [...a];
console.log(a);
console.log(b);

spread를 이용하여 a값의 괄호를 제거해준 다음에 다시 괄호를 씌움.

Object 합치기/복사에 자주 쓰임

var o1 = { a : 1, b : 2 };
var o2 = { c : 3, ...o1 };
console.log(o2);

👉 {c: 3, a: 1, b: 2}

var o1 = { a : 1, b : 2};
var o2 = { a : 3, ...o1 };
console.log(o2);

오브젝트의 key값 중복이 발생하면 무조건 뒤에 오는 a가 됨.
👉 a : 1

spread 연산자는 함수소괄호, 오브젝트 중괄호내, 어레이 대괄호내에서 보통 사용.

🍎 코딩애플 강의 : 매우쉽게 이해하는 JavaScript 객체지향 & ES6 신문법