Study JavaScript 0408 - 1hr 자료형

변승훈·2022년 4월 8일

Study JavaScript

목록 보기

2/43

자료형

Javascript에서 값은 항상 문자열이나 숫자형 같은 특정한 자료열에 속한다.
기본적으로 8가지의 자료형이 있다.
Javascript의 변수는 자료형에 관계 없이 모든 데이터일 수 있는데, 어떤 순간에는 문자열, 다른 순간엔 숫자가 될 수 있다.

  let message = "hello";

  message = 123;

이처럼 자료의 타입은 있지만 변수에 저장되는 값의 타입은 언제든지 바꿀 수 있는 언어를 동적 타입(dynamically typed) 언어라 한다.

1. 숫자형

숫자형은 정수(number type) 혹은 소수점 숫자(floating point number)를 나타낸다.

숫자형을 이용하여 연산작업을 수행할 수 있다. ex) +, *, -, /
숫자형엔 일반적인 숫자 외에 Infinity, -Infinity, NaN과 같은 '특수 숫자 값(special numeric value)'이 포함된다.

Infinity : 무한대(∞), 어떤 수든 0으로 나누면 무한대를 얻을 수 있다.
또는 직접 무한대를 참조할 수도 있다.

  alert( 1 / 0 );  // 어떤 수든 0으로 나누는 경우

  alert(Infinity); // 무한대를 직접 참조

NaN : 계산 중 에러가 발생했다는 것을 나타내주는 값이다.
부정확하거나 정의되지 않은 수학 연산을 실행할 경우 계산중에 에러가 발생하며, 이때 NaN이 반환된다.
연산 과정에서 어디에선가 NaN이 반환 되었다면, 이는 모든 결과에 영향을 미친다.

alert( "연산 테스트" / 2 ); // NaN, 문자열을 숫자로 나누어 오류 발생

2. BigInt

내부 표현 방식 때문에 Javascript에서는 ( $2^{53}$ -1)(9007199254740991) 보다 큰 값 혹은 -( $2^{53}$ -1) 보다 작은 정수는 '숫자형’을 사용해 나타낼 수 없다.
대부분의 상황에서는 문제가 되지 않지만 암호 관련 작업같이 아주 큰 숫자가 필요한 상황이거나, 아주 높은 정밀도를 가진 작업을 해야할 경우 이런 큰 숫자가 필요하다.

BigInt형은 표준으로 채택된지 오래 되지 않은 자료형으로, 길이에 상관없이 정수를 나타낼 수 있다.
BigInt형 값은 정수 리터럴(값)의 끝에 'n'을 붙이면 만들 수 있다.

	const bigInt = 123456789101112131415161718192021222324252627282930n;

3. 문자형

Javascript에서는 문자열(String)을 따옴표로 묶는다.

  let str = "Hello";
  let str2 = 'Single quotes are ok too';
  let phrase = `can embed another ${str}`;

따옴표는 " 큰 따옴표 (Quotation mark), ' 작은 따옴표 (Apostrophe), ` 역 따옴표(Back tick)가 있다.

" 큰 따옴표 (Quotation mark), ' 작은 따옴표 : Javascript에서는 이 둘을 기본적인 따옴표로 두기 때문에 이 둘에 차이를 주지 않는다.
` 역 따옴표(Back tick) : 변수나 표현식을 감싼 후 ${...}안에 넣어주면 원하는 변수나 표현식을 문자열 중간에 손 쉽게 넣을 수 있다.
수학 관련 표현식도 넣을 수 있다.

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

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

4. 불린형

불린형(boolean, 논리타입)은 true, false 두 가지의 값을 가지고 있다.
단어 뜻 대로 긍정(true, yes), 부정(false, no)의 값을 저장할 때 사용한다.

  let nameFieldChecked = true; // 네, name field가 확인되었습니다. => checked

  let ageFieldChecked = false; // 아니요, age field를 확인하지 않았습니다. => not checked

boolean 값은 비교 결과를 저장할 때도 사용된다.

  let highNumber = 10 > 3;

  alert( highNumber );  // true (비교 결과 : yes)

5. null

null은 오직 null값만 포함하는 별도의, 자신만의 자료형이다.

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

	let age = null; // 알 수 없음 or 비어 있음

6. undefined

undefined값도 null값 처럼 별도의, 자신만의 자료형이다.
undefined는 값이 할당되지 않은 상태를 나타낼 때 사용한다.

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

  let age;

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

변수에 명시적으로 undefined을 할당하는 것도 가능하지만 권장하지 않고 이러한 경우는 'null'을 사용한다.

7. 객체와 심볼

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

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

8. typeof

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", Math는 수학연산을 제공하는 내장 객체이므로 object가 출력

  typeof null // "object", 언어 자체의 오류이며 null은 객체가 아니다.

  typeof alert // "function", 피연산자가 함수이면 function을 반환한다. 
  // 함수형은 따로 없고 객체형에 속하며 오래전에 만든 규칙 이기에 하위 호환성을 위해 남겨진 상태이다.