데이터 타입


자바스크립트는 데이터에 대해서 매우 유연한 언어 입니다. c언어처럼 데이터를 입력을 위해서 변수의 타입을 지정하지 않습니다.

프로그램의 언어를 학습할때 초보자들이 가장 어려워 하는 것중에 하나가 사전에 변수의 형을 같이 선언을 하는 것입니다. 하지만 자바스크립트의 경우 변수에 데이터를 저장할때 자료형을 별도로 지정을 하지 않습니다. 변수명만 선언하여 값을 입력을 하면 자동으로 변수에 저장이 됩니다.

변수에 저장되는 값는 일반적인 자료형 뿐만 아니라 표현식, 함수도 저장이 가능합니다. 변수에 데이터를 저장하게 되면, 변수는 해당 자료에 대한 유형을 가지게 됩니다.
다른말로, 타입(type)이라고 합니다.

자바스크립의 자료형의 값 표현은 크게 원시타입(primitive data type)과 참조 타입(reference data type)입니다. 객체는 참조타입이며, 그외는 원시 타입입니다.

원시타입


원시타입은 메모리에 고정된 크기로 저장이 됩니다.
변수에 대한 값에 대하여 직접 메모리를 할당 받으며, 크기를 가지고 있습니다.

원시타입의 값는 고정된 공간에 할당되기 때문에 변경이 불가능한 immutable value 특징을 가지고 있습니다.

원시 타입은 총 6개가 있습니다.

  • 숫자형
  • 불형
  • 문자열
  • 심볼
  • null
  • undefined

참조타입


메모리의 참조값을 저장합니다.
대표적으로 객체가 있습니다. 객체는 여러 가지 형태의 값을 가질 수 있습니다.

자바스크립트는 몇개의 내장된 객체 타입을 지원합니다.

  • Array
  • Date
  • RegExp
  • Map, WeakMap
  • Set, WeekSet

변수 종료


변수는 사용 용도와 범위에 따라서 4개의 종류로 구분이 됩니다.

범위


  • 전역변수
  • 지역변수

용도


  • 매개변수
  • 맴버변수

자료형


보다 자세한 자바스크립트 데이터 타입에 대한 종류를 알아 봅니다.

숫자형(number)


숫자 데이터를 저장합니다. 숫자는 다시 정수형실수형으로 나누어 집니다.

var x = 10;

또는, 숫자를 표현할때 16진수로 정의할 수 있습니다.

var color = #ff0000;

정수와 실수 모두 하나의 자료형으로 처리 됩니다.

문자열


문자열은 텍스트 데이터 입니다. 텍스트 데이터를 저장합니다.

var name = "hello world";

작은 따옴표 또는 큰 따옴표를 사용하여 문자열을 지정합니다. 자바스크립트의 문자열은 유니코드 텍스트 입니다.

문자, 숫자 구분


숫자를 따옴표로 표시를 하면 문자로 처리됩니다.

let age1 = 17;
let age2 = "20";

console.log(typeof age1);
console.log(typeof age2);

두개의 변수의 타입을 확인해 보도록 합니다.

실행결과

$ node variable_05.js
number
string

익스케이프


익스케이프 표현를 통하여 특별한 기호를 문자열로 작성을 할 수 있습니다.

특수문자


화면에 출력되지 않는 특수한 문자를 문자열로 작성 할 수 있습니다.

  • \n
  • \r
  • \t
  • \'
  • \"
  • \`
  • \$
  • \\
  • \uXXXX
  • \uXX

템플릿 문저열


문자열 안에 변수의 값을 표현할 수 있습니다.

기존 es5에서는 리터럴 문자열과 변수의 값을 같이 문자열로 처리할 때 +로 결합을 하였습니다.

let temp = 20.5;
const message = "현재 온도는 " + temp + " 입니다.";

es6에서는 $기호 특수문자로 결합을 할 수 있습니다.

let temp = 20.5;
const message = `현재 온도는 ${temp} 입니다.`;

이때 주의해야 하는 점은 따옴표가 아닌 백틱으로 문자열을 감싸서 처리를 합니다.

bool


컴퓨터는 0과 1로 표현을 합니다. 이를 논리값으로 참(true)와 거짓(false) 불 값을 표현합니다.

let status = true;

논리변수는 조건제어문을 처리할때 많이 사용이 됩니다.

undefined


자바스크립트에서만 존재하는 특별한 타입입니다. 자바스크립트를 처음 학습할때 어려운 데이터 타입니다. 4개의 예를 들어 undefined 상태가 되는 경우를 알아 보도록 합니다.

초기화 생략

변수를 선언을 하였으나, 초기화를 하지 않는 변수의 값을 말합니다. 아직 변수에 데이터가 한번도 저장된 적이 없기 때문에, 자료형을 알 수 없습니다.

let name;
console.log(typeof name);

실행결과

$ node variable_06.js
undefined

미선언 변수


선언되지 않은 변수를 참조할려고 할때 undefined가 출력이 됩니다.

console.log(typeof name);

실행결과

$ node variable_07.js
undefined

미전달 매개변수


함수를 선언할때 매개변수를 함께 인자로 받을 수 있습니다. 하지만, 정작 함수를 호출할때에 인자값을 생략을 하면 함수의 매개변수는 값이 존재 하지 않게 됩니다.

function hello(msg)
{
    console.log(typeof msg);
}

hello("안녕하세요");
hello();

실행결과

$ node variable_08.js
string
undefined

함수를 처음 호출을 할때에는 매개변수의 인자값을 같이 전달을 하였습니다. 이때에는 msg 변수가 string 타입을 가지게 됩니다.

두번째 함수를 호출할때에는 인자값을 전달 하지 않았습니다. 오류가 나지는 않지만, 함수는 정상적으로 실행이 됩니다. 인자 값이 없기 때문에, 변수를 초기화 하지 못하였습니다. 이때에는 msg 변수가 undefined 타입을 가지게 됩니다.

미선언 프로퍼티


객체지향에서 객체는 내부 변수인 프로퍼티를 가지고 있습니다. 미선언 되어있는 프로퍼티를 접그할 때에서 undefined 가 표시됩니다.

null


null은 undefined와 다른 값입니다. 변수에 아무런 값도 없는 null 을 저장합니다.

var empty = null;

자바스크립트는 변수를 초기화 하거나, 처음 값을 입력할때 데이터의 타입을 정의하게 됩니다. 변수가 초기화 없이 생성이 되면, undefined를 가지게 됩니다. 그리고 null은 비어있는 값으로 초기화를 한 것입니다.

변수를 초기화 할때 많이 이용을 합니다.

심볼


상수형인 심볼 값을 저장할 수 있습니다.

var system = symbol('abcd');

심볼은 es6에서 추가된 자료형 입니다.

객체


객체의 값을 저장할 수 있습니다.

var obj = {
    name: "apple",
    price: 1000
}

배열


배열의 값을 저장할 수 있습니다.

var fruits = ['banana', 'apple'];

함수


함수를 담을 수 있습니다.

var myfunc = function() {

}

글로벌 객체


자바스크립트의 모든 객체의 부모객체를 말합니다. 다양한 표준 내장 객체를 제공합니다.