배열구조분해할당

배열구조분해할당

let firstName = arr[0];
let surname = arr[1];
let [firstName, surname] = arr; // 단축표현

구조분해는 특별한 문법구조체이다.
[] = 우항에 올수있는 객체는 무엇인가? 배열인가?

모양을 보면 배열객체를 반복순회하면서 좌항변수에 할당하는 방식이 될것으로 예상된다. 그렇다 우항이 이터러블하면 구조분해할당이 가능하다.

let [str0,str1,str2] = 'def';

let [firstName, , title] = ["Julius", "Caesar", "Consul", "of the Roman Republic"];

let [one, two, three] = new Set([1, 2, 3]);

let user = {};
[user.name, user.surname] = "Bora Lee".split(' ');

let guest = "Jane";
let admin = "Pete";
[guest, admin] = [admin, guest];

우항에 이터러블객체를 사용하면되고 좌항의 대괄호기호는 실제 배열이 생성되는것이 아니고 문법상 필요한 것이고 우항값을 참조할 수있는 식별자를 사용하면 된다.

let user = {
  name: "John",
  age: 30
};
for (let [key, value] of Object.entries(user)) {
  alert(`${key}:${value}`);
}

Object.entries는 배열객체를 반환하므로 반복순회시 배열구조분해할당이 가능하다.

let user = new Map();
user.set("name", "John");
user.set("age", "30");

for (let [key, value] of user) {
  alert(`${key}:${value}`); // name:John, then age:30
}

Map객체자체는 이터러블객체이지 배열은 아니다.

for (const val of user) {
   console.log(Array.isArray(val)); // true
}
for (const [key,val] of user) {   
}

Map객체의 프로퍼티는 배열로 저장되어있으니 당연히 배열구조분해할당이 가능하다.

let [name1, name2, ...rest] = ["Julius", "Caesar", "Consul", "of the Roman Republic"];

나머지연산자도 지원한다.

let [name="Guest", surname="Anonymous"] = ["Julius", , 'babo'];

기본값도 지원한다.

let [surname=prompt('성을 입력하세요.'), name=prompt('이름을 입력하세요.')] = ["김"];

표현식도 사용이 가능하다.

연습문제
최고월급을 받는 사람의 이름출력하기

let salaries = {
   "John": 100,
   "Pete": 300,
   "Mary": 250
 };
let maxSalary=0;
let maxSalaryUserName;
for (const [key,val] of Object.entries(salaries)) {
   if(maxSalary<val){
      maxSalary = val;
      maxSalaryUserName = key;
   }
}
console.log(maxSalaryUserName);

for (const [key,val] of Object.entries(salaries)) {
   if(maxSalary<val){
      [maxSalaryUserName,maxSalary] = [key,val];
   }
}

반복순회시 배열구조분해할당을 사용하면 가독성이 좋아진다.