[React]리액트 학습 기록_차세대ES6_구조분해할당(Destructuring)

Destructuring은 배열의 원소나 객체의 프로퍼티를 추출해서 변수에 저장할 수 있도록 해준다.

🔍 스프레드와 Destructuring의 차이점

• 스프레드는 배열의 모든 프로퍼티를 배열로 가져오는 것이다.
• 반면 destructuring은 원소나 프로퍼티를 하나만 가져와서 변수에 저장한다.

Destructuring

const numbers = [1,2,3];
[num1, num2] = numbers;
console.log(num1, num2);

// console
1
2

위와 같은 경우는 index 1,2를 num1,num2에 각각 넣어준 것이다.
만약 인덱스 1,3을 num1,num3에 각각 넣고 싶다면 아래와 같이 해주면 된다.

const numbers = [1,2,3];
[num1, , num3] = numbers;
console.log(num1, num3);

// console
1
3

공백을 넣어주면 해당 인덱스는 무시된다.