JavaScript 문법 - spread 연산자

spread 연산자란 ?

spread 라는 단어가 가지고 있는 의미는 펼치다, 퍼뜨리다 입니다. 이 문법을 사용하면, 객체 혹은 배열을 펼칠수있습니다.
스프레드 연산자를 사용하면 배열, 문자열, 객체 등 반복 가능한 객체 (Iterable Object)를 개별 요소로 분리할 수 있다.

객체

let person = {name:'jihye', age : 10 }
let person2 = {...person};
let person3 = person 

console.log(person2); {name:'jihye', age : 10 }
console.log(person3); {name:'jihye', age : 10 }

{...person} 쓰는 것과 person3=person 차이점은 ?

person3 = person을 하였을 때,
person3 는 기존 person 객체의 주소값만 복사를 한다.
즉, 객체는 하나인데 그 객체를 참조하는 변수가 두개

{...person} 은 실제로 객체를 새로 생성한다. 따라서 기존의 변수 person과 {...person} 값으로 할당해준 person2는 완전히 다르다.

따라서,

person == person2  // false
person == person3 // true  

---

배열

let a = [1, 2, 3]
let b = {...a, 4};

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

let c = [...a, ...b]
console.log(c); // [1,2,3,1,2,3,4];
//a와 b는 전혀 다른 배열이므로 각각 배열에 담긴 값이 모두 담긴다.


var arr1 = ['철수','영희']; 
var arr2 = [...arr1]; 

arr2.push('바둑이'); 

console.log(arr2); // [ "철수", "영희", "바둑이" ]
// 원본 배열은 변경되지 않는다.
console.log(arr1); // [ "철수", "영희" ]

---

함수

var input = [{name:'철수',age:12}, {name:'영희',age:12}, {name:'바둑이',age:2}];

//가장 어린 나이 구하기.
var minAge = Math.min( ...input.map((item) => item.age) );
console.log(minAge); // 2



function addMul(method, ...rest){ 
  if (method === 'add') {
    let sum = 0;
    for (let item of rest) {
      sum += item;
    }    
     return sum;    
  } else if (method === 'multiply'){
    let mul = 1;
    for (let item of rest) {
      mul *= item;
    }
     return mul;    
  }
 
} 

console.log( addMul('add', 1,2,3,4) ); // 10
console.log( addMul('multiply', 1,2,3,4) ); // 24

이 때, Rest파라미터는 항상 제일 마지막 파라미터로 있어야 합니다.
function addMul (...rest, method){ }와 같은 방식으로는 사용할 수 없습니다.