자료형

오민영·2023년 2월 16일

[2023] Javascript

목록 보기

2/4

‘자바스크립트에서 값’은 항상, 문자열이나 숫자열 같은 특정한 자료형에 속한다.

자바스크립트에는 여덟 가지 기본 자료형이 있다.

자바스크립트의 변수는 자료형에 관계없이 모든 데이터일 수 있고, 따라서 변수는 어떤 순간에는 문자열일 수 있고 어떤 순간에는 숫자가 될 수 있다.

// no error
let message = "hello";
message = 123456;

이처럼 자료의 타입은 있지만 변수에 저장되는 값의 타입은 언제든지 바뀔 수 있는 언어를 ‘동적 타입’ 언어라고 부른다.

숫자형(Number type)

정수 및 부동소수점 숫자를 나타낸다.

숫자형과 관련된 연산은 아래가 대표적이다.

일반적인 숫자 외에 아래와 같은 ‘특수 숫자 값(special numeric value)’ 이 포함된다.

Infinity

어떤 숫자보다 더 큰 특수 값, 무한대(∞) 를 나타낸다.
어느 숫자든 0으로 나누면 무한대를 얻을 수 있다.

alert(1 / 0); // 무한대

alert(Infinity); // 무한대

NaN

계산 중에 에러가 발생했다는 것을 나타내주는 값이다.
부정확하거나 정의되지 않은 수학 연산을 사용하면 계산 중에 에러가 발생하는데, NaN 을 반환한다.

alert( "숫자가 아님" / 2 ); // NaN, 문자열을 숫자로 나누면 오류가 발생합니다.

alert( "숫자가 아님" / 2 + 5 ); // NaN

BigInt

IE 지원 안함

내부 표현 방식 때문에 자바스크립트에선 (2의 53승 -1)(9007199254740991) 보다 큰 값 혹은 -(2의 53승 -1) 보다 작은 정수는 '숫자형’을 사용해 나타낼 수 없다. 대부분의 상황에서는 문제가 되지 않으나, 암호 관련 작업과 같은 큰 숫자가 필요한 상황이거나 정밀도로 작업을 해야할 때는 이런 크고 작은 숫자가 필요하다.

BigInt 형은 표준으로 체택된 지 얼마 안된 자료형으로, 길이에 상관없이 정수를 나타낼 수 있다.

BigInt 형 값은 정수 리터럴 끝애 n 을 붙이면 만들 수 있다.

// 끝에 'n'이 붙으면 BigInt형 자료입니다.
const bigInt = 1234567890123456789012345678901234567890n;

문자형 (String)

문자열은 따옴표로 묶어 사용한다.

기본적인 따옴표는 큰 따옴표 & 작은 따옴표로 차이를 두진 않는다.

“ “ - 큰 따옴표

‘ ‘ - 작은 따옴표

`` - 역 따옴표(백틱)

역 따옴표로 변수나 표현식을 감싼 후 &{…} 안에 넣어주면, 원하는 변수나 표현식을 문자열 중간에 쉽게 넣을 수 있다. &{…} 안에는 변수나 수학 관련 표현식을 넣거나, 더 복잡한 표현식을 넣을 수 있다. 무엇이는 들어갈 수 있다. 큰 따옴표나 작은 따옴표를 사용하면 중간에 표현식을 넣을 수 없음!

let name = "John";

// 변수를 문자열 중간에 삽입
alert( `Hello, ${name}!` ); // Hello, John!

// 표현식을 문자열 중간에 삽입
alert( `the result is ${1 + 2}` ); // the result is 3

// 큰따옴표는 확장 기능을 지원하지 않는다.
alert( "the result is ${1 + 2}" ); // the result is ${1 + 2}

불린형 (Boolean)

true(긍정) | false(부정)

두 가지 값만 존재하는 자료형이다.

불린형은 긍정이나 부정을 나타내는 값을 저장할 때 사용한다.

let nameFieldChecked = true; // 네, name field가 확인되었습니다(checked).
let ageFieldChecked = false; // 아니요, age field를 확인하지 않았습니다(not checked)

let isGreater = 4 > 1;
alert( isGreater ); // true (비교 결과: "yes")

‘null’ 값

null 값은 지금까지 소개된 자료형 중 어느 자료형에도 속하지 않는 값이다.

null 값은 오로지 null 값만 포함하는 별도의 자료형을 만든다.

null은 존재하지 않는(nothing) 값, 비어 있는(empty) 값, 알 수 없는(unknown) 값을 나타내는 데에 사용한다.

let age = null;
// 나이(age)를 알 수 없거나, 그 값이 비어있음을 보여준다.

‘undefined’ 값

undefined 도 null 값 처럼 자신만의 자료형을 형성한다.

undefined는 ‘값이 할당되지 않은 상태’를 나타낼 때 사용한다.

변수를 선언했지만, 값을 할당하지 않았다면, 해당 변수는 자동으로 undefined가 할당된다.

변수가 ‘비어 있거나’ ‘알 수 없는’ 상태라면 null을 사용하고, undefined는 값이 할당되지 않은 변수의 초깃값을 위해 예약어로 사용한다.

let age;

alert(age); // 'undefined'가 출력됩니다.

객체(Object)와 심볼(Symbol)

객체(object)은 특수한 자료형이다.

객체형을 제외한 다른 자료형은 문자열이든 숫자든 한 가지만 표현할 수 있기 때문에 원시(Primitive) 자료형이라 부른다. 반면 객체는 데이터 컬렉션이나 복잡한 개체(Entity)를 표현할 수 있다. 이런 특징 때문에 자바스크립트에서 객체는 좀 더 특별한 취급을 받는다.

심볼(symbol)은 객체의 고유한 식별자(unique identifier)를 만들 때 사용한다.

typeof 연산자

typeof 연산자는 인수의 자료형을 반환한다.

자료형에따라 처리 방식을 다르게 하고 싶거나 변수의 자료형을 빠르게 알아내고자 할 때 유용하다.

// 연산자
typeof x

// 함수
typeof(x)

괄호가 있든 없든 결과는 동일하다.

typeof x 를 호출하면, 이수의 자료형을 나타내는 문자열을 반환한다.

typeof undefined // "undefined"

typeof 0 // "number"

typeof 10n // "bigint"

typeof true // "boolean"

typeof "foo" // "string"

typeof Symbol("id") // "symbol"

typeof Math // "object"  (1)

typeof null // "object"  (2)

typeof alert // "function"  (3)