🦎 JavaScript/JavaScript

[JS] 구조 분해 할당

하나둘세현 2024. 8. 21. 19:43
728x90

객체 키를 가진 데이터 여러개를 하나의 엔티티에 저장할 때 사용

배열 컬렉션에 데이터를 순서대로 저장할 때 사용

 

구조 분해 할당 

객체나 배열을 변수로 '분해'할 수 있게 해주는 특별한 문법

 

분해는 파괴를 의미하지 x


배열 분해하기

let arr = ["Bora", "Lee"]

let [firstName, surname] = arr;

alert(firstNAme); // Bora
alert(surname); // Lee

 

인덱스를 이용해 배열에 접근하지 않아도 변수로 이름과 성을 사용 가능

split같은 반환 값이 배열인 메서드를 함께 사용해도 좋음

let [firstName, surname] ="Bora Lee".split(' ');

 

쉼표를 사용해 요소 무시 가능

let [firstName, ,title] = ["Julius", "carrer", "consul"];
alert(title); // consul

 

.entires()로 반복

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

 

변수 교환 트릭

let guest = "Jane";
let admin = "Pete";

[guest, admin] =[admin, guest];

 

'...'로 나머지 요소 가져오기

배열 앞쪽에 위치한 값 몇개만 필요하고 그 이후 나머지 값들은 한 데 모아서 저장하고 싶을때 점 세개 ...를 붙인 매개변수 하나를 추가하면 나머지 요소를 가져올 수 있다.

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

alert(name1); // Julius
alert(name2); // Caesar

 

 

728x90

'🦎 JavaScript > JavaScript' 카테고리의 다른 글

[JS] forEach  (0) 2024.08.22
[JS] 스타일과 클래스  (0) 2024.08.22
[JS] 문자열  (0) 2024.08.21
[JS] 할당  (0) 2024.03.13
[JS] 이터러블  (0) 2024.03.13