리액트(4)

 

 

 

 

 

 

 

 

자바스크립트는 기본형과 참조형으로 나뉨.

 

 - 기본형 : const number = 1;  

 

 - 참조형 :const num2 = number;  

   ( 값 1을 num2에 복사)

   ( 참조형에는 객체와 배열이 있음.)

 

 - 또 다른 예시

 

const person = {
  name: 'Max'
};

const secondPerson = person;

console.log(secondPerson); // 'Max'

객체 person 은 메모리에 저장
상수 person 에는 메모리에 있는 주소를 가리키는 포인터를 저장
person 을 seconPerson 에 할당하면 포인터가 복사될 것

--------------------------------------------------------

만약 복사된 것을 가진 다음에 person.name을 'Manu'로 바꾼다면 ?

const person = {
  name: 'Max'
};

const secondPerson = person;

person.name = 'Manu';

console.log(secondPerson); // 'Manu'

secondPerson을 출력새ㅓ 'Max'가 출력될 것이라고 생각하지만
person이 가리키는 메모리에 있는 동일한 객체를 가리킴
그래서 person의 name을 변경하면 자동적으로 secondPerson의 이름도 바뀜.

-----------------------------------------------------------------

const person = {
  name: 'Max'
};

const secondPerson = {
  ...person
};

person.name = 'Manu';

console.log(secondPerson); // 'Max'

이름을 'Manu'로 바꾸었지만 여전히 'Max'가 출력되는 이유는
...person 에서 포인터가 아닌 진짜 복사본을 생성했기 때문이다.

 

 

 

 

'React' 카테고리의 다른 글

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