본문 바로가기

코드스테이츠

구조분해할당

구조 분해 할당 왜 필요한가?

첫 번째 예시는 배열이 [1,2,3] 을 새로운 변수 a,b,c에 대입하고 싶을 때, 일일이 변수를 선언하고 정의하면 효율적이지 않다. 그렇기 때문에 [a,b,c]=[1,2,3]을 하면 바로 대입도 가능하고 코드도 간결할 수 있다. 

 

두 번째 

 

MDN 에서는 구조분해 할당은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식이다. 라고 정의한다.

 

구조 분해 할당이 필요한 이유는 개발을 하다 보면 함수에 객체나 배열을 전달해야 하는 경우가 생긴다. 가끔은 객체나 배열에 저장된 데이터 전체가 아닌 일부가 필요한 경우가 생기는 것처럼 말이다.

 

이럴 때 객체나 배열으 ㄹ변수로 '분해'할 수 있게 해주는 문법이 구조 분해 할당(destructuring assignment) 을 사용하면 된다. 이 외에도 함수의 매개 변수가 많거나 기본값이 필요한 경우 등에서 구조 분해를 사용하기도 한다.

 

 

배열 분해 예제)

1
2
3
4
5
6
7
8
9
10
11
12
let arr = ["JungHyun", "Lee"]


let [firsName, surname] = arr;


alert(firstName); //JungHyun
alert(sername);   //Lee


//구조 분해 할당을 사용하지 않으면 밑에처럼 직접할당해야한다.


// let [firsName, surname] = arr;
let firstName = arr[0];
let surname = arr[1];
cs

세 번째 구조분해 할당하여 함수의 인자 값으로 넣을 수 있다.

'코드스테이츠' 카테고리의 다른 글

props 의 이해  (0) 2021.09.02
리엑트 2 props && state  (0) 2021.08.17
코드스테이츠 리엑트  (0) 2021.08.11
코드스테이츠 html의 또 다른 표현 방식 DOM!!  (0) 2021.08.06
코드스테이츠 spread & ...args  (0) 2021.08.05