📍오늘 배운 내용

• ES6문법 => rest,spread 연산자 사용법
• 객체나 배열 필드는 단순히 reference만 복사한다. 따라서, deep copy (깊은복사) 를 위한 별도의 작업을 해주한다.

1️⃣ ES6 Rest, Spread Operator

1. Rest Operator

• 함수의 인자, 배열, 객체 중 나머지 값을 묶어 사용하도록 한다.
• 함수의 인자 중 나머지를 가르킨다.
• 배열의 나머지 인자를 가르킨다.
• 객체의 나머지 필드를 가르킨다.

function checkMin(...rest) {
	// ... (rest연산자) 를 이용해서 배열을 만든다.
	// [7, 3, 5, 2, 4, 1] 따라서 배열메소드 reduce() 사용
  return rest.reduce((a,b) => a<b ? a : b)
}
console.log(checkMin(7, 3, 5, 2, 4, 1)); //1

배열의 경우, 인자가 하나도 없다면 rest operator로 묶을 수 없다.

2. Spread Operator

• 묶인 배열 혹은 객체를 각각의 필드로 변환
• 객체는 또다른 객체로의 spread 를 지원한다.
• 배열은 또다른 배열의 인자, 함수의 인자로의 spread 를 지원한다.

const bio = {
  name: 'zeeyoon',
  age : 27,
  address : 'Seoul',
  job : 'FrontEnd Engineer',
};

//============= rest 연산 ==============
const {age, name, ...rest} = bio;
// 여기서 rest 는 객체 
// const age = bio.age
// const name = bio.name
// const rest = biot.나머지필드    와 동일한 코드라고 생각하기
console.log(age, name, rest);
// 27 zeeyoon { address: 'Seoul', job: 'FrontEnd Engineer' }

// ============ spread 연산 ==================
let bio2 = {...bio, name: "june", age : 26 }
// bio객체를 가져오고 이름과 나이는 덮어씌우기 (...bio가 뒤에오면 바꾼내용은 의미X)

2️⃣ 구조 분해할당

• 인덱스 순서대로 그대로 할당된다. (arr 에 2번째 인덱스에 데이터가 추가해도 추가한 데이터는 할당되지 않는다.)

let arr = ["Zeeyoon", "Kyeong"];

let[firstName, lastName] = arr;
console.log(firstName);
console.log(lastName);

• 객체의 구조분해할당
  • 프로퍼티(필드)를 사용하면 순서상관없다
  • 프로퍼티명을 바꿔 줄 수 있다.

let user = {
  name: 'zeeyoon', 
  age: 25,
  location: 'seoul',
  edu : 'STNU'
}
let {edu, age, location} = user;
console.log(edu);		//STNU
console.log(age);		//25
console.log(location);	//seoul

let {name : lastname} = user;
console.log(lastname);	//zeeyoon