Javascript 원시 자료형과 참조 자료형

young·2022년 5월 12일
0

4/25~ 5/23 Section 1 TIL

목록 보기
13/23

✅원시 자료형 (primitive data type)

: 고정된 저장공간을 차지하는 data type

  • 객체가 아니면서 method를 가지지 않는 7가지 타입

    1. number

    2. string

    3. boolean

    4. null

    5. undefined

      (+ bigint, symbol)


  • 하나의 정보를 담고 있다. (1:1)
let variable = value;

  • 변수에 값(value) 자체가 저장 된다.
let min = 'young'; // 변수 min에 'young' 할당
let kim = min; // 변수에 담겨있던 값을 저장한다

console.log(kim)
>'young'

  • 값 자체에 대한 변경이 불가능하지만, 변수에 담긴 내용을 재할당 하여 변경할 수 있다.
let kim = 123; // 변수 kim을 123으로 재할당
console.log(kim);
>123

console.log(min);
>'young' // 변수 min의 값은 변경되지 않는다

✅참조 자료형 (Reference data type)

: 동적(dynamic)으로 변하는 저장공간(= heap)을 사용하는 data type

  1. 배열
  2. 객체
  3. 함수

  • 하나의 참조 자료형에 여러 데이터를 담을 수 있다. 데이터를 추가하고, 삭제하는 것에 따라서 보관함의 크기가 달라진다.
let ref = [1, 2, 3];
let data = { month : 1, date : 31 };

  • 참조 자료형이 변수에 할당될 때에는 값 자체가 아닌, 보관함의 주소(reference)가 할당 된다
💡참조 자료형의 비교

console.log(123 === 123) // 원시 자료형 number의 strick equality
>true


console.log({m : 'y'} === {m  : 'y'}) // 참조 자료형 object의 strick equality
>false
// 자바스크립트에서는 참조 자료형 각각의 보관함을 만든다
// strick equality는 그 주소값이 같은지를 비교하기 때문에
// false를 반환한다



💡참조 자료형의 복사

let mercy = {may: 12, spring : 'sunny'};
let today = mercy; // --->객체 today와 mercy는 보관함의 주소(reference)를 공유하게 된다

today['may'] = 3 // 보관함의 요소를 변경하면 주소를 공유하는 변수들에 영향이 간다

console.log(mercy);
> {may: 3, spring: 'sunny'} // --->mercy의 요소가 변경되었다


✔️ 원시 자료형 ↔ 참조 자료형 ?!

let thu = [5, 12];
let wed = thu;

console.log(wed);
>[5,12]  // wed === thu 인 상태


let wed = 5; //---> 원시 자료형으로 변경하면, thu의 값도 변화할까?

console.log(wed);
>5

console.log(thu);
>[5,12] //---> 변화하지 않는다


💡각각의 자료형으로 분리된다
profile
즐겁게 공부하고 꾸준히 기록하는 나의 프론트엔드 공부일지

0개의 댓글