DEVELOPMENT NOTE/Javascript / / 2022. 12. 16. 09:03

[Javascript] 자료형(Data Type) / 형 변환

반응형

 

 

 



자바스크립트의 자료형 종류와 형 변환에 대한 정리.


원시형 자료 (Primitive type)


원시형 자료는 특정 값이 메모리에 바로 저장된 것이다. 값만 저장된다.

 

let num1 = "2"; //문자
let num2 = 2; //숫자
let isOk = true; //boolean
let error; //undefined
let isBlank = null; //null

console.log(typeof num1); //string
console.log(typeof num2); //number
console.log(typeof isOk); //boolean
console.log(typeof error); //undefined (값이 선언되지 않았으므로)
console.log(typeof isBlank); //obejct

 

  1. 문자열(string) - "apple", "rabbit", "title"...
  2. 숫자(number) - 0, 42, 954...
  3. 불린형 = 참거짓형(boolean) - true, false
  4. undefined - 변수를 만들고 값을 할당하지 않으면 undefined로 저장된다. (에러)
  5. null - 값이 비어있긴 하지만 일부러(명시적으로) 값을 비워둔 경우. 객체(object) 형태로 취급되기에 참조형 자료라고 볼 수도 있다. 메모리는 만들어야 하는데 값은 지금 없어서 일부러 비워둔 것. (에러가 아님)

 

참조형 자료 (reference type)


값의 참조값, 즉 주소값만 메모리에 저장되는 것. 위치만 알려주고 찾아가서 꺼내오도록 한다.

 

let colors = ["red", "yellow", "brown", "blue"];
console.log(colors[0]); // red
console.log(colors[7]); // undefined (존재하지 않으므로)

let student1 = {
    name : "홍길동",
    age : 20,
    address : "Seoul",
    isMale : true
};

 

  1. 배열(array) - 여러개의 값들을 그룹으로 묶어서 저장된 형태. 각 값들은 순서값으로 탐색이 가능하다. 배열은 [대괄호] 안에 넣는다.
  2. 객체(object) - 여러개의 값들을 그룹으로 묶어서 저장된 형태. 각 값들마다 고유의 key값을 넣어서 저장하고, 탐색할 때도 key값으로 탐색한다. 객체는 {중괄호} 안에 넣는다.

 

 

 

형 변환(Type Conversion)


특정 조건에 부함되면 자료형이 강제로 변환되는 현상. 숫자가 문자로 변하는 현상이 대표적이다.

 

let num1 = "4"; // 문자열
let num2 = 5; // 숫자
let num3 = 6; // 숫자

console.log(num1+num2+num3); // "456"
console.log(num3+num2+num1); // "114"

연산식은 한 줄에서 왼쪽에서 오른쪽으로 연산된다.

 

첫번째 console.log에서 4와 5의 형이 맞지 않으므로, 5를 강제로 문자로 '형변환'시켜 문자열 4와 문자열 5를 결합시킨다. 이어서 오는 6도 앞의 45이 문자열이기 때문에 문자열로 변환된다.

 

두번째 console.log에서 6과 5는 숫자이므로 더하기가 적용되지만, 11과 4에서 4는 문자열이므로 덧셈을 할 수 없어 앞에 11이 다시 문자열로 변환되어 결합된다. 

 

 


 

자바스크립트의 자료형과 형변환에 대해 알아보았다. 자료형은 단순한 이론이 아니라 자바스크립트 내에서 자료의 타입과 특성을 활용하여 다양한 곳에서 사용하게 되므로 꼼꼼하게 알아둘 필요가 있다. 

 

이런 다양한 자료형의 값들을 가지고 다양한 연산을 수행하게 되므로 형 변환의 특성에 대해서도 파악해두어야겠다. 

반응형