20190525 33-JS-Concepts :: 03 Values Type & Reference Types

Values Type & Reference Types

• 레퍼런스 타입은 여러 값들을 포함하고 있다.
• 레퍼런스 타입에 대한 변수는 해당 값에 대한 참조를 가지고 있다.
• 참조라는 것은 실제 메모리에 저장된 값에 대한 위치를 가리키고 있다.
• 결론적으로 참조 변수는 실제 값을 포함하고 있지 않다.

☞ Array

let arr = [];       	// # Address #001 -> [] 
                        // # Variable 'arr' -> #001 
arr.push(10);
arr.push(20);

console.log(arr);       // (2) [10, 20]
console.log(arr[0]);    // 10

let copyArr = arr;  	// # Variable 'copyArr' -> #001

console.log(copyArr === arr);   // true

copyArr.push(30);
console.log(copyArr, arr);      // (3) [10, 20, 30] (3) [10, 20, 30]

• 참조변수는 저장된 위치에 대한 값을 가리키고 있다. (#001)
• 참조변수의 주소 값은 정적이다.
• 주소 값의 메모리 내에는 배열 [] 이 존재한다.

 

☞ Object

let a = {};
let b = a;      // 동일 참조값, 동일 주소 값을 가리키고 있다.

a.value = 10;

console.log(a); // {value: 10}
console.log(b); // {value: 10}

let person = {};
person.age = 10;
// {age: 10}

person.name = "Harray";
// {age: 10, name: "Harry"}

person.items = ["coke", "bag"];     
// {age: 10, name: "Harry", items: Array(2)}

/** 
Person{
    age: 10,
    items: (2) ["coke", "bag"]
    name: "Harry"
}
**/

let obj = { first: 'reference' };   // #123 주소의 메모리에 값을 할당
obj = { second: 'ref2' }            // #678 주소의 메모리에 값을 재 할당

• 자바스크립트 엔진은 더 이상 사용하지 않는 오브젝트에 대해서 가비지 컬렉션을 수행한다.
• 자바스크립트 엔진은 가비지 컬렉션을 수행을 통해 오브젝트를 메모리에서 삭제한다.
• 결과적으로 위 내용의 first: 'reference' 더 이상 접근할 수 없기 때문에, 사용하지 않기 때문에 가비지 컬렉션이 수행되고 메모리에서 삭제된다.

reference

모든 자바스크립트 개발자가 알아야하는 33가지 개념