라벨이 Destructuring인 게시물 표시

[JavaScript] 구조 분해 할당 (Destructuring assignment)

구조 분해 할당은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있도록 해주는 JavaScript 표현식이다. ... 점 3개를 사용하여 배열이나 객체를 해체할 수 있다. 배열 구조분해 (Destructuring Array) const arr1 = [ 1 , 2 , 3 , 4 , 5 ] ; const arr2 = [ 6 , 7 , 8 , 9 , 10 ] ; const sumArr = [ ... arr1 , ... arr2] ; console . log (sumArr) ; //[1, 2, 3, 4, 5, 6, 7, 8, 9, 10] ... 를 사용하여 배열을 해체할 수 있다. 배열 안에 두개의 배열을 구조분해 해 놓으면 위에서 처럼 하나의 배열로 합칠 수 있다. const data = [ " person1 " , " person2 " , " person3 " , " person4 " ] ; const [ fisrt , , third ] = data ; console . log (fisrt , third) ; //person1 person3 배열 안에 first, thrid와 같이 변수를 작성하면 해당 변수가 지정된 인덱스와 일치하는 값이 해당 변수에 할당되어 출력된다. 배열 인덱스 1번은 작성하지 않았기 때문에 건너뛰고 인덱스 0과 2의 값만 할당하여 출력하고 있다. 객체 구조분해 (Destructuring Object) const person = { name : ' kim ' , address : ' korea ' , age : 30 , }; // 객체 Destructuring 하는방법 const { name , age } = person ; console . log (name , age) ; // kim 30 // obj객체에서 키 값을 다른 변수명으로 할당해