JavaScript 데이터 타입

유형

---

Primitive
변수에 값 할당하면 곧바로 저장된다
예) string, number...

reference
변수에 값 할당하면 컴퓨터 메모리에 그 값을 저장하고
경로만 변수에 저장한다
예) Array, Object...

이 특성으로 인해 Object나 Array의 값을 복사or변경 시 이상한 일이 벌어진다.

변수에 Primitive 자료형을 할당한 경우,
변수 값을 재할당하면 곧바로 변경되지만

reference 자료형을 할당한 경우
재할당 시 그 기존 값이 갱신되진 않는다.
대신 새로운 object자료형이 메모리 내 생성되며, 그 메모리로의 새 경로가 할당된다.

Primitive data type의 값 변경

var a = 1
var b = a

a = 2
console.log(a) // 변경된 값은 2가 출력됨
console.log(b) // 변경 전 a의 값인 1이 출력됨

Reference data type의 값 변경

var obj1 = { name : 'Kim' }
var obj2 = obj1

obj1.name = 'Park'

console.log(obj1) // 변경 후 값인 { name : 'Park' } 출력
console.log(obj2)  // 위와 같이 obj1의 변경 후 값인 { name : 'Park' } 출력

obj2의 값을 따로 obj1의 값으로 변경하라고 작성하지 않아도 변경된다.
WHY?
obj1, obj2 모두 { name : 'kim' }값이 저장되어있는 컴퓨터 메모리의 경로만을 저장하고 있다.
그러므로 obj1이 위 값을 변경한 경우, 같은 경로 값을 가진 obj2도 변경된 값이 적용된다.

참조 : obj1의 값 변경 시 오브젝트의 키 값에 접근하여 value를 재할당하는 게 아니라, 오브젝트 자체를 할당한다면
위와 같은 현상이 안 일어난다
WHY?
위 명령어의 뜻은
컴퓨터 메모리에 새로운 object를 만들어 그 경로를 obj1에 저장하라는 의미이기 때문이다.

var a = { name : kim }
var b = { name : kim }

console.log(a==b?)
// 결과 : false

메모리에 각각 object자료를 만들어 그 경로가 변수에 저장됨.
컴퓨터 메모리 안에 같은 자료가 두개 만들어지고, 그 경로가 각각의 변수에 저장된 것이다. 서로 다른 경로를 값으로 가지고 있으므로 false가 출력된다.

만약...
Object자료형 변경함수를 아래와 같이 만든다면
변수변경방법1: 오브젝트 전체를 재할당 (X)

    var obj1 = { name : 'kim' }
    var obj2 = obj1

function change(obj){
 obj = { name : 'lee' }
}

change(obj1)

console.log(obj1) // 결과 : { name : 'Kim' }

obj의 값을 출력해봐도 변경되지 않음을 볼 수 있다

함수의 parameter는, 변수를 잠시 생성하는 역할을 한다.
위의 코드를 컴퓨터 입장에서 바라본다면
obj라는 변수를 다시 만들고 그 경로를 저장하라는 뜻이다.
그러므로 obj1값에는 변화가 없다.

만약 obj1의 값을 변경하고 싶다면, 아래 코드와 같이
오브젝트 전체를 재할당하지 말고 key값에 접근해 변경하도록 한다.

변수변경방법2: 오브젝트 키 값에 접근해 재할당 (O)

    var obj1 = { name : 'kim' }
    var obj2 = obj1

function change(obj){
	obj.name = 'Lee'}

change(obj1)

console.log(obj1) // 결과 : { name : 'Lee' }

결론

Object, Array 자료형을 변경하고 싶다면
오브젝트 전체를 재할당하지 말고 key값에 접근해 변경한다.