1. 함수 매개 변수

• 나머지(가변) 매개 변수

  function sum(...numbers) {
    return numbers.reduce((acc, curr) => acc + curr, 0);
  }
  
  console.log(sum(1, 2, 3, 4)); // 10
  

2. 비구조화 할당

• 객체에서 특정 값 추출 후 나머지 데이터를 받는 용도

  const animal = {
  	animalName: '곰이',
  	animalType: '고양이',
  	animalAge : 20, 
  	animalGender : 'male'
  };
  
  const {animalName: animalTitle, animalType, ...rest} = animal;
  
  console.log(animalTitle);
  console.log(animalType);
  console.log(rest);
  

3. 깊은 복사

배열

• 얕은 복사

  const arr1 = [10, 20, 30];
  const arr2 = arr1;
  
  console.log(arr1 === arr2); // true
  arr1.push(40);
  console.log(arr2); // [10, 20 30, 40]
  

• 깊은 복사

  const arr1 = [10, 20, 30];
  const arr2 = arr1;
  const arr3 = [...arr1]; // const arr3 = [10, 20, 30]; 새로운 배열을 정의하는 것과 같음
  
  console.log(arr1 === arr2); // true
  console.log(arr1 === arr3); // false
  
  arr1.push(40);
  console.log(arr3);
  

객체

• 얕은 복사

  const user1 = { name: 'kim', age: 20 };
  const user2 = user1;
  user1.name = 'Ann';
  
  console.log(user1 === user2);
  console.log(user2);
  

• 깊은 복사

  const user1 = { name: 'kim', age: 20 };
  const user2 = {...user1};
  user1.name = 'Ann';
  
  console.log(user1 === user2);
  console.log(user2); // { name: 'kim', age: 20 }
  

4. 병합

배열

const arr1 = [10, 20];
const arr2 = [30, 40];

const combined1 = arr1.concat(arr2); // [10, 20, 30, 40]
const combined2 = [arr1[0], arr1[1], arr1[2], arr1[3]]; // [10, 20, 30, 40]
const combined3 = [...arr1, ...arr2]; // [10, 20, 30, 40]

객체

• 속성이 덮어 씌워지는 것을 주의하자

  const user1 = { name: 'kim', age: 20 };
  const user2 = { name: 'Ann', age: 30 };
  
  const combined = { ...user1, ...user2 }; //{ name: 'Ann', age: 30 }
  

• 새로운 속성 만들기

  const user1 = { name: 'kim', age: 20 };
  const user2 = { name: 'Ann', age: 30 };
  
  const combined = { ...user1, gender: 'male' }; //{ name: 'Ann', age: 30 }
  console.log(combined);
  

응용

const printHello = ({name, age}) =>  `${name}은 ${age}세 입니다.`;
console.log(printHello({name: '철수', age:20}));