자바스크립트 - Spread 구문 syntax

const numbers = [1, 2, 3];

console.log(numbers); [1,2,3]
console.log(...numbers); 1 2 3
console.log(1, 2, 3); 1 2 3

rest 와는 반대 (개별 요소를 하나의 배열로 묶는다)

 

 

배열을 복사할때 편리하다 / 객체도 가능(ES2018~)

const numbers = [1, 2, 3];
const num = numbers;                  객체의 주소를 참조하므로 num의 요소가 바뀌면 numbers 요소도 바뀜
const numArr = numbers.slice();   이를 피하기 위해 slice()로 배열을 복사해야 영향을 미치지 않는다
const numSpread = [...numbers, 9];  spread로 복사할 수 있음! & 요소(다른 배열도 가능)를 바로 추가할 수도 있음

num.push(5);
numArr.push(7);

console.log(numbers); //[ 1, 2, 3, 5 ]
console.log(num); //[ 1, 2, 3, 5 ]
console.log(numArr); //[ 1, 2, 3, 7 ]
console.log(numSpread); //[ 1, 2, 3, 9 ]

 

 

배열을 펼쳐서 각각의 아규먼트로 사용도 가능 /객체는 x

 

const intro = (name, birth, job) => {
  console.log(`저는 ${name}입니다`);
  console.log(`${birth}생년이고`);
  console.log(`직업은 ${job}입니다`);
}

const myArr = ['콬코코', 2020, '무직'];
intro(...myArr);

 

 

그렇지만 스프레드 구문이 값 자체는 아님!! 값들의 목록임 -> 변수에 할당할 수는 없다 

 

+ 객체 내 모든 요소 뒤에는 쉼표(, ) 를 넣어주자 : 마지막 요소이더라도 일관성 & 누락 방지