객체의 구조 분해 할당

ⓐ
const obj1 = {
  id : 1
  name : "김"
  age : 20
  habbit : "game"
};

const id = obj1.id;
const name = obj1.name;
const age = obj1.age;
const habbit = obj1.habbit;
//이런 식의 변수 할당은 비효율적

const {id, name, age, habbit} = obj1
//구조 분해 할당으로 효율적으로 사용 가능. 위의 코드들과 완전히 같음.
ⓑ
const {age, habbit, id, name} =obj1 
//내부 순서 상관없음
ⓒ
const {id, age} = obj1
//이런 식으로 필요한 key만 뺄 수 있음
ⓓ 만약 해당하는 값이 없다면 : 기본값
const {name, age, gender = 'male'} = obj1;
//undefined이라면 기본 값 할당
const {...gender:'female'} = obj1;
console.log(gender); // female
//undefined일 때만 기본 값이 유효함

ⓔ
const {id: userId, age: userAge}
//새로운 변수 이름 할당 가능

배열의 구조 분해 할당

ⓐ
const [x, y] = [1, 2]
console.log(x) = 1
console.log(y) = 2

ⓑ
const arr1 = [1, '김', 20];

const [id, name, age] = arr1;
//위와 마찬가지로 효율적인 변수 할당 가능
//대괄호 내의 값이 '변수명'. 값을 index 순서에 따라 차례로 할당.
const [id, _, age] = arr1;
//그러나 객체와 달리 필요한 값만 빼둘 수 없음, index가 꼬이기 때문. 따라서 필요 없는 것은 ' _ '로 표시 해주는 식의 방법도 가능함.


let users = ['kim', 'lee', 'park'];
let [user1, user2, user3] = users;
console.log(user1); // kim
console.log(user2); // lee
console.log(user3); // park

ⓒ
let str = "kim-lee-park";
let [user1, user2, user3] = str.split('-');
console.log(user1); // kim
console.log(user2); // lee
console.log(user3); // park

ⓓ 만약 해당하는 값이 없다면 : 기본값
let [a, b, c] = [1, 2];
console.log(c); // undefined

let [a=3, b=4, c=5] = [1, 2]
//이렇게 각 변수에 기본 값을 주면 에러 방지 가능. undefined 대신 기본 값을 가짐.
console.log(a); //1
console.log(b); //2
console.log(c); //5

ⓔ 일부 반환값 무시 : 공백과 쉼표를 사용
let [user1, ,user2] = ['kim', 'lee', 'park', 'choi'];
console.log(user1); // kim
console.log(user2); // park (공백과 쉼표를 이용, lee를 무시)
// choi 또한 할당이 안 되므로 무시

ⓕ 배열 구조 분해 : 바꿔치기
let a = 1;
let b = 2;
			//만약 a값을 b로 b값을 a로 바꾸고 싶다면
let c = a;  //c는 사실상 필요한 변수 아님. c에 a값을 잠시 저장.
a = b; //a에 b값 저장
b = c; //b에 c값(기존 a)값 저장.
//이와 같은 방식은 상당히 복잡함.

let a = 1;
let b = 2;
[a, b] = [b, a];
//깔끔하게 값 바꿔치기 완성