구조분해할당

김하은·2023년 1월 20일
0

구조분해할당.

모던자바스크립트에서 정리한 바에 따르면 객체나 배열을 변수로 분해 할 수 있게 해주는 특별한 문법을 구조분해할당 이라고 정의하였다.

무슨말인가 하니,

const name = [firstName,secondName]

이렇게 생성한 배열에 각각의 인덱스를 이용해 배열에 접근하지 않아도 사용할 수 있다는 것이다.
쉼표를 사용하여 사용하지 않는 요소는 무시할수 있다.. 라고하는데 좀 더 쉬운 예제를 찾아보았다.

const arr [1,2,3]
const first = arr[0]

이런식으로 변수에 배열의 인덱스에 해당하는 값을 담아주는 것이 아니라, 해당 배열의 인덱스를 배열 구조분해 할당 방법으로

const [aaa] = arr

이렇게 작성한다면 배열 arr의 0번째 인덱스 값을 aaa로 받아올 수 있다.

그럼 위의 설명에서

쉼표를 사용하여 사용하지 않는 요소는 무시할수 있다..

라는 부분은 무엇일까?

 const [aaa,,bbb] = arr

그럼 aaa에는 arr의 0번째 인덱스가, bbb에는 arr의 2번째 인덱스의 값이 들어가는것.

=> 이렇게보니 배열에서는 구조분해할당을 적용시에 어떤 변수로 담아줄지보다 원하는 값을 뽑기위해 그 변수의 위치가 중요함을 알 수 있다.

이번에는 객체를 구조분해할당을 해준다.

이때 배열에서 분해되는 대상은 배열의 value였는데, 객체에서는 객체의 속성이 분해대상이 된다.즉, 정확히는 해당 키명이 변수가되어 사용될 수 있다.

const obj = {
name:"John",
age:12,
school:"hog"
};

=> const {age,name} = obj;

객체의 경우 순서상관없이 해당 키에따른 값을 저장한다.
대신, 다른 이름을 사용해서는 안된다.

여기서 스프레드 연산자를 활용한 즉, 객체의 구조분해 할당에서 쓰이는 Rest Properties라는 개념이있다.
스프레드 연산자를 쓰는것 같은데 나머지들을뽑아낼때 사용한다.
즉,,,

const {name, ...rest} = obj
이렇게 적어놓고 name을 찍으면 name에 해당하는 값이 나오고,
rest를 찍게되면 name을 제외한 나머지의 값이 나온다.

rest라는 이름대신 다른 이름을 사용해도된다.

0개의 댓글