구조분해 할당

이동환·2020년 10월 9일
1

TIL

목록 보기
40/74

구조 분해 할당

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

기본 구문

1. 배열

let a, b;
[a, b] = [1,2]
console.log(a,b); // 1 2
//
let first, second, rest
[first, second, ...rest] = [10, 20, 30, 40, 50];
console.log('first : ' + first, 'second : ' + second)
// first :10 second :20
console.log('rest : ' + rest)
// rest : 30,40,50

2. 객체
(주의 할점. A 와 B 부분 처럼 소괄호로 전체를 감싸준다.)

let a, b;
({a, b} = {a :'hi', b: 'world'});  // A(주의할 점)
console.log(a,b); // hi world
//
let first, second, rest
({first, second, ...rest} = {first :10, second: 20, third: 30, fourth: 40}); // B(주의)
console.log('first : ' + first, 'second : ' + second)
// first : 10 second : 20
console.log(rest)
// {third: 30, fourth: 40}

배열에서 값 때어내기

구조 분해 할당의 구문은 위와 비슷하지만, 대신 할당문의 좌변에서 사용하여, 원래 변수에서 어떤 값을 분해해 할당할지 정의한다.

let x = [1, 2, 3, 4, 5];
let [y, z] = x;
console.log(y); // 1
console.log(z); // 2

undefined 일때, 기본값
: 변수에 기본값을 할당하면, 분해한 값이 undefined일 때 그 값을 대신 사용한다.

var a, b;
[a = 5, b = 7] = [1];
console.log(a); // 1
console.log(b); // 7
profile
UX를 개선하는것을 즐기고 새로운것을 배우는것을 좋아하는 개발자입니다.

0개의 댓글