Neori.log

[모던 JavaScript 튜토리얼] 자료형

  • 2022년 02월 18일

모던 JavaScript 튜토리얼을 읽고 정리한 글입니다.

Preview

JavaScript에는 8가지 기본 자료형이 있다.

  • 숫자형: 정수, 부동 소수점 숫자 등의 숫자. 정수의 한계는 \(\pm2^{53}\)이다.

  • biging: 길이 제약 없이 정수를 나타낼 수 있다.

  • 문자형: 빈 문자열이나 글자로 이뤄진 문자열. 단일 문자를 나타내는 별도의 자료형은 없다.

  • 불린형: true, false

  • null: null 값(알 수 없는 값)만을 위한 독립 자료형

  • undefined: undefined 값(할당되지 않은 값)만을 위한 독립 자료형

  • 객체형: 복잡한 데이터 구조를 표현할 때 사용한다.

  • 심볼형: 객체의 고유 식별자를 만들 때 사용한다.

typeof 연산자는 피연산자의 자료형을 알려준다.

  • typeof x 또는 typeof(x) 형태로 사용한다.
  • 피연산자의 자료형을 문자열 형태로 변환한다.
  • null의 typeof 연산은 "object"인데 이는 언어상 오류이다. null은 객체가 아니다!

자료형

JavaScript에서 값은 항상 특정 자료형에 속한다. JavaScript에는 8가지 기본 자료형이 있다.

동적 타입 언어인 JavaScript는 자료의 타입은 있지만 변수에 저장되는 값의 타입은 언제든지 바꿀 수 있다.

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

🔢  숫자형

숫자형은 정수 및 부동소수점 숫자를 나타낸다. 숫자형과 관련된 연산은 곱셈*, 나눗셈/, 덧셈+, 뺄셈- 등이 대표적이다. 일반적인 숫자 외에 특수 숫자 값(Infinity, -Infinity, NaN)도 포함된다.

  • Infinity: 어떤 숫자보다 더 큰 특수 값, 무한대(∞)를 나타낸다.
    • 어느 숫자든 0으로 나누면 무한대를 얻을 수 있다.
    • Infinity를 직접 참조할 수도 있다.
  • NaN: 계산 중에 에러가 발생했음을 나타내는 값. 부정확하거나 정의되지 않은 수학 연산을 사용하면 계산 중에 에러가 발생할 수 있다.
    • 문자열을 숫자로 나누면 에러가 발생한다.
    • NaN에 어떠한 추가 연산을 해도 결국 NaN이 반환된다.
    • 연산 과정 어디에선가 NaN이 반환되면 모든 결과에 영향을 미친다.
alert(1/0); // 무한대
alert( Infinity ); // 무한대
alert( "숫자가 아님" / 2 ); // NaN
alert( "숫자가 아님" / 2 + 5 ); // NaN

JavaScript에서 하는 수학 연산은 안전하다. 0으로 나누거나 숫자가 아닌 문자열을 숫자로 취급하는 등의 연산도 가능하다. 에러 대신 NaN을 반환하며 연산을 종료할 뿐!

현실에서는 특수 숫자 값을 숫자로 취급하진 않지만 JavaScript에서는 숫자형으로 분류한다.

🦖  BigInt

내부 표현 방식 때문에 JavaScript에서는 (\(2^{53}\)-1)(9007199254740991)보다 큰 값 또는 -(\(2^{53}\)-1)보다 작은 정수는 숫자형으로 나타낼 수 없다. 대부분의 경우에는 이런 제약이 문제가 되지 않지만, 아주 큰 숫자가 필요하거나 아주 높은 정밀도로 작업을 해야 할 때는 이런 큰 숫자가 필요하다.

BigInt형은 표준으로 채택된지 얼마 안 된 자료형으로, 길이에 상관없이 정수를 나타낼 수 있다. 정수 리터럴 끝에 n을 붙이면 만들 수 있다. Firefox, Chrome, Edge, Safari에서만 지원하고 IE에서는 지원하지 않는다.

const bigInt = 1234567890123456789012345678901234567890n;

🔠  문자형

JavaScript에서는 문자열(string)을 따옴표로 묶는다. 큰따옴표""와 작은따옴표''는 구분 없이 쓰인다. 역 따옴표(백틱, backtick)로 변수나 표현식을 감싼 후 ${...} 안에 넣어주면 변수나 표현식을 문자열 중간에 넣을 수 있다.

let name = "Neori";

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

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

이렇게 문자열 중간에 들어간 변수나 표현식은 평가가 끝난 후 문자열의 일부가 된다. 기본적인(큰/작은) 따옴표를 사용하면 중간에 표현식을 넣을 수 없다!

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

다른 일부 언어는 글자 하나를 저장할 때 쓰이는 자료형인 글자(character)형을 따로 지원한다. C언어와 Java의 char가 대표적인 예이다. JavaScript는 글자형을 지원하지 않는다. 글자 하나 이상 들어갈 수 있다.

❓  불린형

불린(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 값만 포함하는 별도의 자료형이다.

let age = null;

JavaScript의 null은 다른 언어의 null과 성격이 다르다. 다른 언어에서는 존재하지 않는 객체에 대한 참조나 널 포인터를 나타낼 때 사용한다. 하지만 JavaScript에서는 존재하지 않는(nothing) 값, 비어 있는(empty) 값, 알 수 없는(unknown) 값을 나타낼 때 사용한다.

let age = null;은 나이(age)를 알 수 없거나 그 값이 비어 있음을 의미한다.

📦  ‘undefined’ 값

undefined도 null처럼 자신만의 자료형을 갖고, 값이 할당되지 않은 상태를 나타낼 때 사용한다. 변수를 선언했지만 값을 할당하지 않으면 해당 변수에 undefined가 자동으로 할당된다.

let age;
alert(age); // 'undefined'

변수에 undefined를 명시적으로 할당하는 것도 가능하긴 하다. 하지만 이렇게 직접 할당하는 것은 권장하지 않는다. 변수가 비어 있거나 알 수 없는 상태라면 null을 사용하자. undefined는 값이 할당되지 않은 변수의 초기값을 위한 예약어로 남겨두자.

let age = 100;

// 값을 undefined로 바꾼다.
age = undefined;

alert(age); // "undefined"

🧳  객체와 심볼

객체(object)형은 특수한 자료형이다. 객체형을 제외한 다른 자료형은 한 가지만 표현할 수 있기 때문에 원시(primitive) 자료형이라고 부른다. 반면 객체는 데이터 컬렉션이나 복잡한 개체(entity)를 표현할 수 있다.

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

❗️  typeof 연산자

typeof 연산자는 인수의 자료형을 나타내는 문자열을 반환한다. 자료형에 따라 처리방식을 다르게 하고 싶거나 변수의 자료형을 빠르게 알아내고자 할 때 유용하다. 연산자(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)

Math는 수학 연산을 제공하는 내장 객체이다. 내장 객체는 객체형이다.

typeof null의 결과는 "object"이다. null은 고유한 자료형을 갖는 특수 값이라서 객체는 아니지만, 하위 호환성을 유지하기 위해 오류를 남겨뒀다. 언어 자체의 오류이므로 유의해야 한다!

typeof는 피연산자가 함수이면 "function"을 반환한다. 하지만 함수형은 따로 없다. 함수는 객체형에 속한다. 형식적으로는 잘못되긴 했지만 아주 오래전에 만들어진 규칙이라서 하위 호환성 유지를 위해 남겨진 상태이다.

© Neori.log 2022
검색