1. 자바스크립트에서의 자료형(Data Type)
변수와 상수를 담는 값들에는 다양한 형태들이 존재합니다. 이를 자료형이라고 합니다.
자바스크립트는 동적 타입 언어이기 때문에 변수의 타입을 미리 선언할 필요가 없습니다.
동적 타입 언어: 컴파일 시 자료형을 정하는 것이 아니고 실행 시에 결정합니다. 프로그램이 처리되는 과정에서 자동으로 파악되고, 이 말은 결국 같은 변수에도 불구하고 상황에 따라 값의 타입이 바뀔 수 있다는 뜻이기도 합니다.
Run time까지 타입에 대한 결정을 끌고 갈 수 있기 때문에 많은 선택의 여지가 있는 장점이 있습니다. 하지만 이러한 인터프리터 언어는 배우는데 쉬우나 실행 도중에 변수에 예상치 못한 타입이 들어와 Type Error를 내보내는 경우가 생길 수 있다는 단점이 있습니다.
2. 자료형 종류
자바스크립트에는 총 7가지 데이터 타입이 있는데, 큰 부류로 2가지로 나눠질 수 있습니다.
2.1 기본형 (Primitive Type)
첫 번째는 기본형입니다. 원시 타입, 변경 불가능한 값 (Immutable Value) 이라고도 부릅니다.
Boolean, Null, Undefined, Number, String, Symbol 총 6가지 기본형 데이터 타입이 있습니다.
boolean 타입은 논리적인 요소를 나타내는 데이터 형식으로, true와 false의 두 가지 값을 가질 수 있습니다.
let isSoldier = true;
let isStudent = false;
null 타입은 null 이라는 딱 한 가지 값을 가지는 타입입니다. null 값은 오로지 null값만 포함하는 별도의 자료형을 만듭니다.
다른 언어에서는 null을 존재하지 않는 개체에 대한 참조나 널포인터를 나타낼 때 사용합니다. 하지만 자바스크립트에서는 존재하지 않는 값, 비어있는 값, 알 수 없는 값을 나타내는데 사용합니다.
let myBalance = null;
undefined 타입도 Undefined라는 딱 한 가지 값을 가지는 타입입니다. 값이 할당되지 않은 상태를 나타낼 때 사용합니다.
변수는 선언했지만, 값을 할당하지 않았다면 해당 변수에 undefined가 자동으로 할당됩니다.
let myBalance;
alert(myBalance); // 'undefined'
number 타입은 숫자형 데이터입니다. 데이터 타입에 조금 엄격한 프로그래밍 언어들은 소수형과, 정수형을 서로 다른 타입으로 구분하지만, 자바스크립트 경우에는 숫자가 올 수 있는 값들은 모두 number 타입입니다.
let n = 123;
n = 12.345;
숫자 형태의 값 말고도 숫자가 아닌 값을 표현하는 NaN 이라는 값과 양의 무한대와 음의 무한대를 표현하는 Infinity, -Infinity도 number 타입입니다.
NaN은 계산 중 에러가 발생했다는 것을 나타내주는 값입니다. 부정확하거나 정의되지 않은 수학 연산을 사용하면 계산 중 에러가 발생하는데 이때 NaN이 반환됩니다.
alert("아 집에 가고 싶다" / 2); // NaN, 문자열을 숫자로 나눌 수 없습니다.
연산 과정 중 어디에선가 NaN이 반환되었다면 이는 모든 결과에 영향을 미칩니다.
Infinity는 어떤 숫자보다 큰 무한대를 나타냅니다.
alert(1 / 0); // 무한대
alert(Infinity); // 무한대
String 타입은 문자형 데이터를 말하는데, 작은따옴표(''), 큰따옴표(""), 역따옴표(``)가 양쪽으로 감싸고 있는 데이터들을 모두 String 타입이라고 합니다.
역 따옴표로 변수나 표현식을 감싼 후 ${...} 안에 넣어주면 원하는 변수나 표현식을 문자열 중간에 넣을 수 있습니다.
let name = "Laurent";
alert(`Hello, ${name}!`); // Hello, Laurent!
alert(`The result is ${1 + 2}.`); // The result is 3.
큰따옴표나 작은따옴표를 사용하면 중간에 표현식을 넣을 수 없습니다. 역따옴표만 써야만 가능합니다.
C, JAVA에서는 글자 하나만을 저장할 때 쓰이는 character를 지원합니다. 하지만 자바스크립트에선 이를 지원하지 않습니다. String 타입만 존재합니다.
Symbol 타입은 자바스크립트가 처음 등장할 때는 없었지만, 나중에 새로 추가된 타입입니다. 객체의 고유한 식별자(Unique Identifier)를 만들 때 사용됩니다.
2.2 객체 (Object)
7개의 데이터 타입 중 나머지 한 가지는 객체입니다. 참조형 타입, Reference Type이라고도 부릅니다. 객체는 데이터 컬렉션이나 복잡한 객체(Entity)를 표현할 수 있습니다. 이러한 특징 떄문에 JS에서의 객체는 좀 더 특별한 취급을 받습니다.
배열, 함수, 클래스 모두 객체에 해당합니다. 객체는 내부에서 다양한 Key : Value의 쌍을 가지고서 복잡한 데이터 구조를 형성할 수 있게 합니다. key 에는 String과 Symbol 타입의 값이 들어가고, Value 에는 모든 데이터 타입의 값이 들어갈 수 있습니다.
'Web, Front-end' 카테고리의 다른 글
[CSS] CSS Grid 정리 / 2. Grid Item (2) | 2022.08.27 |
---|---|
[CSS] CSS Grid 정리 / 1. Grid Container (0) | 2022.08.21 |
[CSS] CSS Grid 정리 (0) | 2021.11.20 |
[Javascript] 객체 (0) | 2021.04.18 |
웹 개발에 앞서... (부제: Frontend vs. Backend) (0) | 2021.04.17 |
컴퓨터 전공 관련, 프론트엔드 개발 지식들을 공유합니다. React, Javascript를 다룰 줄 알며 요즘에는 Typescript에도 관심이 생겨 공부하고 있습니다. 서로 소통하면서 프로젝트 하는 것을 즐기며 많은 대외활동으로 개발 능력과 소프트 스킬을 다듬어나가고 있습니다.
포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!