비 구조화 할당(구조 분해 할당)

 

let arr = ['one', 'two', 'three'];

let one = arr[0];
let two = arr[1];
let three = arr[2];

console.log(one, two, three); // one, two, three

위와 같이 작성하게 되면 너무 길어진다. 이거를 줄일수가 있다.

 

배열 비구조화 할당

let arr = ['one', 'two', 'three'];

let [one, two, three] = arr;

console.log(one, two, three); // one, two, three

 

배열 선언 분리 비구조화 할당

let [one, two, three] = ['one', 'two', 'three'];

console.log(one, two, three); // one two three

아래 코드에서 four 값이 undefiend으로 나온다. 이를 고치기 위해서는

let [one, two, three, four] = ['one', 'two', 'three'];

console.log(one, two, three, four); // one two three undefiend

아래와 같이 four에 값을 할당해주면 된다.

let [one, two, three, four='four'] = ['one', 'two', 'three'];

console.log(one, two, three, four); // one two three foyr

값을 스왑 할 수 있다.

let a = 10;

let b = 20;

let tmp = 0;

tmp = a;
a = b;
b = tmp;
console.log(a, b); // 20 10

이를 더 간단하게도 가능

let a = 10;

let b = 20;

[a, b] = [a , b];
console.log(a, b); // 20 10

비구조화 할당으로 함

 

객체 비구조화 할당

이 긴 코드를 간단하게 정리함

let object = {one: 'one', two: 'two', three: 'three'};

let one = object.one;
let two = object.two;
let three = object.three;

console.log(one, two, three) // one two three

객체 비구조화 할당

one 이라는 키를 one에 저장함 나머지도 마찬가지로 저장해서 뽑아줌 

key 값을 기준으로 비구조화 할당으로 함

let object = {one: 'one', two: 'two', three: 'three'};

let {one, two, three} = object;

console.log(one, two, three) // one two three

아래와 같이 이름을 변경해서도 할당이 가능 

키 값으로 저장되기 때문에

name 이라는 키 값을 기준으로 value를 myName 변수에 할당하겠다.

let object = {one: 'one', two: 'two', three: 'three', name: 'doyoung'};

let {name: myName, one, two, three} = object;

console.log(one, two, three, myName) // one two three doyoung

이렇게 하면 undefined이라는 값이 나온다. 이를 고치기 위해서는

let object = {one: 'one', two: 'two', three: 'three', name: 'doyoung'};

let {name: myName, one, two, three, abc} = object;

console.log(one, two, three, myName, abc) // one two three doyoung undefined

 

이렇게 기본값을 할당해주면 된다.

let object = {one: 'one', two: 'two', three: 'three', name: 'doyoung'};

let {name: myName, one, two, three, abc="four"} = object;

console.log(one, two, three, myName, abc) // one two three doyoung four