Frontend/JavaScript

[js] 변수에 데이터저장하는 방식의 차이(배열, 객체 vs 기본 데이터 타입)

양원준 2023. 9. 3. 22:13
728x90

 

변수에 배열과 객체를 저장하는 방식과 기본 데이터 타입을 저장하는 방식은 js에서 차이가 있다

이는 값이 직접 저장되는가, 참조에 의해 저장되는가 에 대한 차이이다

 

 

기본 데이터의 저장

 

기본 데이터 타입을 변수에 저장하면 js는 실 제 값을 변수에 직접 저장한다

다른 변수에 할당할 때, js 는 값을 복사한다

 

let a = 10;
let b = a;  
a = 20;    

console.log(a) // 20
console.log(b) // 10

 

위와 같이 a의 값을 변경해도 b에 영향을 주지 않는다, 이는 값을 복사했기 때문

 

 

 

 

 

배열과 객체의 저장

 

객체와 배열은 변수에 참조로 저장된다.

  • 객체나 배열을 생성할 때, 실제 데이터는 메모리 어딘가에 저장되고
  • 변수는 실제 데이터가 아닌 그 메모리 위치를 가르키는 주소를 가지고 있는다

 

let obj1 = { value: 10 };
let obj2 = obj1;
obj1.value = 20;

console.log(obj1.value) // 20
console.log(obj2.value) // 20


let arr1 = [1, 2, 3];
let arr2 = arr1;
arr1[0] = 9;

console.log(arr1) // [9, 2, 3]
console.log(arr2) // [9, 2, 3]

 

위와 같이 객체나 배열을 다른 변수에 복사하면, 데이터를 복사하는게 아닌 참조값(메모리 위치를 가르키는 주소) 를 참조하기 때문에 같은 데이터를 참조하게 된다

 

따라서 변수를 통해 객체나 배열이 수정될 때, 같은 객체나 배열을 참조하는 모든 다른 변수도 수정이 된다

 

 

 

 

 

728x90