원시 자료형(primitive type)과 참조 자료형(reference type)
이렇게 사물함에 저장할시 많은 배열 중 찾고 싶은 것을 찾기 힘들다.
각각 address를 따로 만들어서 보관
<변수에 할당할 경우>
primitive type : 데이터 값 복사-> 기존의 데이터 영향x
reference type : 주소 복사(같은 주소 쓴다고 보자)
primitive type
primitive data types: 객체가 아니면서 method를 가지지 않는 6가지의 타입
string, number, bigint, boolean, undefined, symbol, (null)
null은 엄밀하게 따지자면 원시 타입이라고 볼 수 없다.
stackoverflow
-
Immutable
-
"하나"의 정보, 즉, 데이터를 담는다 -> 변수에는 하나의 데이터만 담는다.
-
값 자체의 복사 일어난다
원시 자료형을 변수에 할당할 경우
원시 자료형 또는 원시 자료형의 데이터를 함수의 인자로 전달할 경우
// 사실 함수의 인자도 변수에 자료(data)를 할당하는 것.
// 함수를 호출하면서 넘긴 인자가 호출된 함수의 지역변수로 (매 호출 시마다) 새롭게 선언된다.
it('-함수의 인자로 전달할 경우, 값 자체의 복사', function () {
let currentYear = 2020;
function afterTenYears(year) {
year = year + 10;
}
afterTenYears(currentYear);
expect(currentYear).to.equal(2020);
function afterTenYears2(currentYear) {
currentYear = currentYear + 10;
return currentYear;
}
let after10 = afterTenYears2(currentYear);
expect(currentYear).to.equal(2020);
expect(after10).to.equal(2030);
});reference type
reference data type: 원시 자료형이 아닌 모든 것
배열([])과 객체({}), 함수(function(){})가 대표적
별도로 관리되고, 우리가 직접 다루는 변수에는 주소가 저장되기 때문에 reference type이라고 불립니다.
(레퍼런스라는 단어는 본래 참조할 만한 자료라는 영어 단어)
- 특별한 데이터 보관함 'heap'
- Immutable하지 않다
변수에 넣을 수 있는 데이터 크기가 제한됨-->배열, 리스트라는 개념을 구현하기 번거로움, 대량의 정보를 이용하기 위해
"데이터의 크기가 동적으로 변하는(dynamic)" 특별한 데이터 보관함이 필요해짐. (자기 마음대로 사이즈를 늘렸다 줄였다 가능)
const nums1 = [1, 2, 3];
const nums2 = [1, 2, 3];
[1, 2, 3] === [1, 2, 3] // false
nums1 === nums2 // false
Object 자료형은 데이터는 heap에 저장되고, 변수에 할당을 할 경우 변수에는 주소가 저장된다.
1) [1, 2, 3]; // [1, 2, 3]이라는 데이터가 heap에 저장되지만 변수 할당이 되지 않아 주소는 어디에도 저장되지 않는다.
2) const num1 = [1, 2, 3]; // // [1, 2, 3]이라는 데이터가 heap에 저장되고, 그 주소가 변수 num1에 저장된다.
3) const num2 = [1, 2, 3]; // // [1, 2, 3]이라는 데이터가 heap에 저장되고, 그 주소가 변수 num2에 저장된다.
1), 2), 3)에서 말하는 주소는 전부 다른 주소입니다.
아래의 객체 간 비교도 동일한 논리로 이해하시면 됩니다.
expect(person.son === { age: 20 }).to.equal(FILL_ME_IN);
다음 문제를 해결해 보시기 바랍니다.
const num1 = [1, 2, 3]; // [1, 2, 3]이 heap에 저장되고, 그 주소가 변수 num1에 저장된다.
const num2 = num1; // 변수 num1에 저장된 주소가 변수 num2에 저장된다.
// 두 변수 num1, num2는 같은 주소를 저장하고 있습니다. 아래 결과는 어떻게 될까요?
expect(num1 === num2).to.equal(FILL_ME_IN);코드가 실행된 후, myArray의 값은 무엇일까요?
let myArray = [2, 3, 4, 5];
let ourArray = myArray;
ourArray[2] = 25;
ourArray = undefined;
let ourArray = myArray;
변수 ourArray에 myArray의 주소값이 할당 되었습니다.
ourArray[2] = 25;
ourArray 주소값에 위치한 배열의 의 2번째 요소를 25로 변경합니다. ourArray와 myArray의 주소값은 같음으로 현재 myArray는 [2, 3, 25, 5] 입니다.
ourArray = undefined;
이제 변수 ourArray에 원시 자료형 undefined가 할당되었기 때문에, myArray에 접근할 수 없습니다. 하지만 myArray는 그대로 [2, 3, 25, 5]. 아래와 같이 코드가 작성되어 있다면...
let num = 123;
const msg = "hello";
let arr = [1, 2, 3];
const isOdd = true;
원시 자료형의 데이터가 저장되는 공간 (stack)
1 | num | 123
2 | msg | "hello"
3 | arr | heap의 12번부터 3개 // (실제 데이터가 저장되어 있는 주소)
4 |isOdd| true
=====================================
Object 자료형의 데이터가 저장되는 공간 (heap)
10 ||
11 ||
12 || 1
13 || 2
14 || 3
실제 자바스크립트는 변수를 위와 같이 저장할 것입니다. 
Creative Developer