리액트(3)

< Destructuring (디스트럭쳐링) : 배열의 원소나 객체의 프로퍼티를 추출해서 변수에 저장함. >

 

  *스프레드와 다른점 = 스프레드 : 모든 원소와 프로퍼티 가져와서 새 배열이나 객체 또는 우리가사용하는 어떤 것에 전달.

                                  = 디스트럭쳐링 : 원소나 프로퍼티 하나만 가져와서 변수에 저장.

 

 * 배열 디스트럭쳐링

               마치 새 배열 생성하는 모양새이지만

               변수 a와 b에 Hello 와 Max 각각 할당

 

    ex) const numbers =[1,2,3];

          [num1, ,  num3] = numbers;

          console.log(num1,num3); // 1,3

 

 * 객체 디스트럭쳐링

    배열을 디스트럭쳐링 해서 가져올 프로퍼티 순서 정하는 곳에 → 중괄호 사용

    왼쪽에 {name}  넣고 오른쪽 객체의 name 프로퍼티를 대상으로 한다.

    값을 불러오면 age는 undefined 나옴 → 객체에서 이 age를 추출하지 않기 때문

 

 

< 자료 타입 : 참조형과 기본형 >

 

  * 기본형 

console.log(num2); // 1

 

 

 

  * 참조형

 

객체 person 생성/ name 프로퍼티 가짐 /  secondPerson 생성 / 값으로 person 할당

 

 

 

 

 

 

 

'React' 카테고리의 다른 글

리액트(7)  (0) 2023.01.18
리액트(6)  (0) 2023.01.17
리액트(5)  (1) 2023.01.17
리액트(4)  (0) 2023.01.16
리액트(2)  (0) 2023.01.05