[JS] 구조 분해 할당

// 배열 구조 분해 //

let [x, y] = [1, 2];

console.log(x); // 1
console.log(y); // 2

//====================//

let users = ['Mike', 'Tom', 'Jane'];

let [user1, user2, user3] = users;

console.log(user1); // Mike
console.log(user2); // Tom
console.log(user3); // Jane

//====================//

let str = "Mike-Tom-Jane";

let [user1, user2, user3] = str.split('-'); 

// str.split('-') => ["Mike", "Tom", "Jane"] //

console.log(user1); // Mike
console.log(user2); // Tom
console.log(user3); // Jane

// 배열 구조 분해 : 기본값 //

let [a, b, c] = [1, 2];  
// a = 1 , b = 2 , c = undefined //
// 위 처럼 undefined가 할당되어 에러가 나지 않게 기본값을 세팅해줄수있다.

let [a = 3, b = 4, c = 5] = [1, 2];  

console.log(a); // 1
console.log(b); // 2
console.log(c); // 5 => 할당된 값이 없어서 기본값을 return

// 배열 구조 분해 : 일부 반환값 무시 //

let [user1, , user2] = ['Mike', 'Tom', 'Jane', 'Tony'];

console.log(user1); // Mike
console.log(user2); // Jane

// Tom과 Tony는 할당을 받아줄 곳이 없어서 생략

// 배열 구조 분해 : 바꿔치기 //

let a = 1;
let b = 2;

[a, b] = [b, a];

// 객체 구조 분해 // 

let user = {name : 'Mike', age : 30};

let {name, age} = user;
// = 위는 풀어쓰면 아래와 같다 //
let name = user.name;
let age = user.age;

console.log(name); // 'mike'
console.log(age); // 30

// 객체 구조 분해 : 새로운 변수 이름으로 할당 //

let user = {name: 'Mike', age: 30};

let {name : userName, age : userAge} = user;

console.log(userName); // 'Mike'
console.log(userAge); // 30

// 객체 구조 분해 : 기본값// 

let user = {name : 'Mike', age : 30};

// 1. 기본값 X
	let {name, age, gender} = user;
	
	console.log(name); // 'mike'
	console.log(age); // 30
	console.log(gender); // undefined

// 2. 기본값 할당
	let {name, age, gender = 'male'} = user;
	
	console.log(name); // 'mike'
	console.log(age); // 30
	console.log(gender); // male

// 3. 기본값 할당 후 변경값이 있을때

	let user = {
		name : 'Jane', 
		age : 23, 
		gender : 'female'
	};

	let {name, age, gender = 'male'} = user;

	console.log(name); // 'Jane'
	console.log(age); // 23
	console.log(gender); // female