[Code Camp 2주차] Destructuring Assignment

FE 08김우중·2022년 7월 19일
0

Destructuring Assignment?

Destructuring Assignment(구조 분해 할당) 이란 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 자바스크립트 표현식 이라고 한다

1. 기본 문법

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

({a, b} = {a:10, b:20})
console.log(a) // 10
console.log(b) // 20

2. 배열 구조 분해

var foo = ["one", "two", "three"]
var [red, yellow, green] = foo;

console.log(red) // one
console.log(yellow) // two
console.log(green) // three

var a, b;
[a, b] = [1, 2]
console.log(a) // 1
console.log(b) // 2

var a, b;
[a = 5, b = 7] = [1]
console.log(a) // 1
console.log(b) // 7

var a = 1
var b = 3
[a, b] = [b, a]
console.log(a) // 3
console.log(b) // 1

3. 객체 구조 분해

var o = {p: 42, q: true}
var {p, q} = 0;

console.log(p) // 42
console.log(q) // true

var a, b
({a, b} = {a: 1, b: 2})

var o = {p: 42, q: true}
var {p: foo, q: bar} = o;
console.log(foo) // 42
console.log(bar) // true

var {a = 10, b = 5} = {a: 3}
console.log(a) // 3
console.log(b) // 5

var {a: aa = 10, b: bb = 5} = {a: 3}
console.log(aa) // 3
console.log(bb) // 5

출처
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

profile
새내기 개발자

0개의 댓글