원시 자료형

• 변수에 직접 값을 할당하면 해당 변수에는 실제 값이 저장된다.
• 생성된 원시 자료형은 값의 변경이 불가능 하며 읽기 전용 값이다.
• 원시 값을 갖는 변수를 다른 변수에 할당하면 값이 그대로 복사된다.
• 변수에 값을 재할당 하면 값을 변경하는 것이 아닌 다른 메모리에 새로운 원시값을 생성한 다음 재할당 전에 존재하는 불필요한 메모리를 삭제한다.(가비지 콜렉터(garbage collector))

원시 자료형의 종류

• 숫자(Number)
• 문자열(String)
• 불리언(Boolean)
• null
• undefined
• 심볼(Symbol)

---

참조 자료형

• 변수에 값을 할당하면 실제 값이 아닌 원시 자료형이 저장되어 있는 메모리의 주소를 저장한다. 이때 참조 자료형이 실제로 저장된 공간을 '힙(heap)'이라고 한다.
• 생성된 참조 자료형은 값의 변경이 가능하다.
• 참조 값을 갖는 변수를 다른 변수에 할당하면 주소값이 복사된다.
• 값을 재할당하면 힙에서의 값들은 변경되지만 힙을 가리키는 주소는 변경되지 않는다.

원시 자료형의 종류

• 객체(Object)
• 배열(Array)
• 함수(Function)
• 날짜(Date) 등

---

참조 자료형의 얕은 복사와 깊은 복사

얕은 복사

const arr = [1, [2, 3], 4, 5]
const arr2 = [...arr] // arr2 = [1, [2, 3], 4, 5]

arr[0] = 7
// arr = [7, [2, 3], 4, 5]
// arr2 = [1, [2, 3], 4, 5]

//arr와 arr2의 인덱스1에는 주소가 저장되어 있으므로 배열[2, 3]값이 아닌 주소가 복사된다.
arr[1][0] = 9
// arr = [7, [9, 3], 4, 5]
// arr2 = [1, [9, 3], 4, 5]

arr2[1][1] = 6
// arr = [7, [9, 6], 4, 5]
// arr2 = [1, [9, 6], 4, 5]

위와 같이 참조 자료형 안에 참조 자료형이 존재할 경우 얕은 복사를 하면 중첩된 구조 중 한 단계까지만 복사가 된다.

• slice() 👉 배열 복사
• Object.assign() 👉 객체 복사
• spread syntax 👉 배열, 객체 복사

---

깊은 복사

얕은 복사와 달리 내부에 중첩되어 있는 모든 참조 자료형을 복사한다. 하지만 avaScript 내부적으로는 깊은 복사를 수행할 수 있는 방법이 없고, 문법을 응용하여 비슷한 결과물을 만들어 낸다.

• JSON.stringify()과 JSON.parse() 이용하여 복사(예외 경우 존재)
• node.js 환경에서 외부 라이브러리인 lodash, ramda을 사용하여 복사