자료형 (Data type)
프로그램에서 처리할 자료의 형태를 말하며 3이라는 숫자를 숫자로 처리하는지, 문자열로 처리하는지에 따라 결과값이 달라집니다.
* 자료형은 '데이터 유형'이나 '데이터 타입'이라고도 합니다.
사람은 숫자와 문자를 구별할 수 있습니다.
하지만 컴퓨터는 모르기 때문에 일을 시키기 위해서는 이것은 숫자이니 더하거나 빼야하고, 저것은 문자열이니 더하거나 뺄 수 없다는 것을 알려 줄 필요성이 있습니다.
이렇게 숫자나 문자열처럼 프로그램에서 처리할 자료의 유형을 지정해야 하는데, 이러한 자료의 형태를 '자료형'이라고 합니다.
자바스크립트의 자료형은 크게 '원시 유형'과 '객체'로 나뉘어집니다.
자료형에 대해 알아보기 전에 알아야할 것이 있습니다. typeof()함수입니다.
typeof() 함수는 자바스크립트에 미리 만들어져 있는 함수로, 소괄호 안에 값이나 변수를 넣으면 어떤 자료형인지 알려줍니다.
자료형 - 숫자형
모든 프로그램에서 가장 기본이 되는 자료형으로 자바스크립트에서는 정수와 실수를 함께 묶어서 '숫자형'이라고 합니다.
자바스크립트에서는 큰따옴표 없이 입력하면 숫자로 인식합니다.
하지만 숫자라고 해도 큰 따옴표로 묶으면 문자열로 인식하므로 주의가 필요합니다.
문자열
문자열 또는 string 자료형은 작은따옴표(')나 큰따옴표(")로 묶은 데이터를 의미합니다.
템플릿 리터럴
템플릿 리터럴은 문자열과 변수, 식을 섞어서 하나의 문자열을 만드는 표현 형식으로 백팃(``)을 사용해 문자열을 만듭니다.
템플릿 리터럴 안에 변수나 식이 들어간다면 ${}로 묶고 태그나 띄어쓰기, 이스케이프 문자를 그대로 표시할 수 있으므로 사용이 편리합니다.
* 변수와 태그, 줄 바꿈이 포함된 문자열을 화면에 표시하는 예제
let name = "도레미"
let classroom = 201
console.log(name + "님, " + classroom + "호 강의실로 입장하세요. ")
name = "백두산"
classroom = 205
console.log(`${name}님, ${classroom}호 강의실로 입장하세요.`)
템플릿 리터럴에서는 사용자가 소스에 줄을 바꿔 입력하면 출력 결과에서도 줄이 바뀌어 표시 됩니다. 따라서 줄 바꿈 기호를 별도로 넣지 않아도 됩니다.
논리형
논리형은 참(true)이나 거짓(false)값을 표현하기 위한 데이터 유형으로 불리언(Boolean)유형이라고 합니다.
논리형에서 사용할 수 있는 값은 true, false이고 지정한 조건에 맞는지의 여부를 확인하는 조건식에서 많이 사용합니다.
10 > 2 // true
10 < 2 // flase
undefined과 null
undefined은 값이 할당되지 않았을 때의 값입니다. 예를 들어 변수를 선언하고 값을 할당하지 않은 상태라면 초깃값 undefined가 나타납니다.
let username
console.log(username) // undefined
null도 값이면서 동시에 자료형입니다. undefined와 비슷해 보이지만 구별해서 생각하여 하는 개념으로 null은 값이 없거나 유효하지 않은 값이라는 의미입니다. 이에 비해 undefined는 빈 값인지, 유효한 값인지 정의할 수 없는 상태를 말합니다.
객체
객체는 하나의 변수에 다양한 정보가 포함되어 있는 자료형입니다. 객체는 중괄호({})안에 모든 정보를 담는데 키와 값으로 하나 또는 여러 개의 쌍을 만들 수 있습니다. 그리고 객체 안에서는 여러 개의 '키:값' 쌍을 쉼표(,)로 구분합니다.
* 기본형 *
객체명 = {
키 : 값,
키 : 값,
.
.
}
let gitbook = {
title : "깃허브 입문", // 문자열
pubDate : "2019-12-06", //문자열
pages : 272, //숫자
finished : true // 논리값
}
위의 gitbook 객체를 한줄로 표시해도 됩니다.
gitbook = { title : "깃허브 입문", pubDate : "2019-12-06", pages : 272, finished : true }
배열
배열도 하나의 변수에 여러 개의 값을 저장할 수 있는 유형이므로 객체입니다.
배열은 대괄호([])로 묶고 그 안에 값을 나열하는데, 각 값은 쉼표(,)로 구분합니다.
* 기본형 *
배열명 = [값, 값, ... ]
emptyArr = []. // 빈배열
colors = ["red", "blue", "green"] // 문자열 배열
arr = [10, "banana", true] // 여러 자료형으로 구성된 배열