🌙 13일차 - [ javascript ] 핵심 개념과 주요 문법 -

오늘 배운 내용은

1. 원시 자료형과 참조 자료형

오늘도 배운 내용의 핵심만 적으려고 한다.
마찬가지로 디테일한 부분은 자바스크립트 딥 다이브 시리즈에 작성 하려고 한다.

---

원시 자료형과 참조 자료형

✏️ 참조 자료형

• 원시 자료형 (primitive data type) : number, string, boolean 등

  // 원시 자료형(primitive type): number, string, boolean, undefined, null
  42, 'string', true, undefined, null

• 참조 자료형 (reference data type) : 배열, 객체, 함수 등

  // 참조 자료형(reference type)
  [0, 1, 2] // 배열
  {name: 'kimcoding', age: 45} // 객체
  function sum (x, y) { return x + y } // 함수

✏️ 얕은 복사, 깊은 복사

• 원시 자료형 : 할당한 변수를 다른 변수에 할당하면 값 자체의 복사가 일어난다. (값 자체가 복사된다는 것은 둘 중 하나의 값을 변경해도 다른 하나에는 영향을 미치지 않는다는 것을 의미)

• 참조 자료형 : 임의의 저장공간에 값을 저장하고 그 저장공간을 참조하는 주소를 메모리에 저장하기 때문에 다른 변수에 할당할 경우 값 자체가 아닌 메모리에 저장되어 있는 주소가 복사된다.

💡 얕은 복사 ) 중첩된 구조 중 한 단계까지만 복사
Object.assign, slice , spread syntax문법 등과 같은 기존 배열을 새로운 배열로 만든 것을 다른 변수에 저장한다면 다른 주소 값을 가질 수 있게 된다.

위의 함수,문법을 적용해도 복사가 안되는 경우 : 참조 자료형 내부에 참조 자료형이 중첩된 구조는 복사할 수 없다.

💡 깊은 복사 ) 참조 자료형 내부에 중첩되어 있는 모든 참조 자료형을 복사하는 것 // javascript 내부적으로는 깊은 복사를 수행할 수 있는 방법이 없다. 그러나 다른 문법을 응용하면 같은 결과물을 볼 수 있음
다른 문법 : JSON.stringify()와 JSON.parse()
1. JSON.stringify()는 참조 자료형을 문자열 형태로 변환하여 반환
2. JSON.parse()는 문자열의 형태를 객체로 변환하여 반환
++ 먼저 중첩된 참조 자료형을 JSON.stringify()를 사용하여 문자열의 형태로 변환하고, 반환된 값에 다시 JSON.parse()를 사용하면, 깊은 복사와 같은 결과물을 반환
예시 )
const arr = [1, 2, [3, 4]];
const copiedArr = JSON.parse(JSON.stringify(arr));

위의 깊은 복사가 안되는 예외의 경우 )
완전한 깊은 복사를 반드시 해야 하는 경우, node.js 환경에서 외부 라이브러리인 lodash, 또는 ramda를 사용하면 된다.

✏️ 가비지 콜렉터 (garbage collector) :

• JavaScript 엔진은 사용하지 않는 값을 자동으로 메모리에서 삭제한다.
  이것을 가비지 콜렉터 라고 한다.
• 가비지 콜렉터가 어느 시점에 진행되는지는 예측할 수 없다.

  let num = 20;
  num = 30
  => console.log(num) => 30
  이처럼 num에 30을 재할당 하면, 남아있던 20은 가비지 콜렉터에 의해 사용하지 않는 값을
  자동으로 메모리에서 삭제한다.