[Javascript] 쉽게 공부하는 자바스크립트 자료형(Data type)

HTML과 다르게 자바스크립트는 연산능력이 있습니다. 자바스크립트는 단순 산술적 연산 뿐 아니라 논리 연산도 가능해서 다양한 형태의 연산이 가능합니다. 

 

3+7 = 10

 

이러한 연산하기 위해서는 

3과 7에 해당하는 '연산에 필요한 값' ,

그리고 '+', '='에 해당하는 '연산에 사용되는 기호'

가 필요한데요, 

 

자바스크립트에서 '연산에 필요한 값'이 될 수 있는 연산에 사용되는 값의 종류가 바로 '자료형(data type)'입니다. 또한 '연산에 사용되는 기호'에 해당하는 것이 '연산자(operator)' 이지요.

 

자바스크립트에서 변수에 저장할 수 있는 자료형에 대해 알아보겠습니다.

 

---

 

 

자바스크립트 자료형

자바스크립트가 우리나라에 들어왔을 때 자료형을 분류하는 데에는 번역자마다 각기 다른 분류법을 보여주어 현재 다양한 자료형에 대한 분류 방법이 나와 있습니다. 여기서는

   1) 기본 자료형/ 특수 자료형/ 복합 자료형 으로 크게 세분화 한 것과,

   2) 실제 스크립트 코드를 다룰 때 도움이 될만한 기준으로 값들을 분류한 것

이렇게 두가지 모두 올려놓도록 하겠습니다.

 

1) 기본 자료형/ 특수 자료형/ 복합 자료형

 

• 기본 자료형 (3가지) 

var 변수 = "문자";

var 변수 = 숫자; 또는 Number("문자형 숫자");

var 변수 = true or false; 또는 Boolean(데이터);

 

1. 문자형(String):  

   문자형은 텍스트를 표현하며 문자나 숫자를 큰따옴표(“”)또는 작은따옴표(‘’)로 감싸고 있습니다. 문자형 데이터에 HTML 태그를 포함하여 출력하면 태그로 인식합니다. 

2. 숫자형(Number): 단어 그대로 숫자를 의미합니다. 숫자형으로 정수와 부동 소수점, 무한대 및 NaN(Not a Number)값을 포함합니다. 하지만 “5”와 같이 큰따옴표가 숫자를 감싸고 있다면 숫자가 아닌 문자형 데이터입니다. 

3. 불린(Boolean): 논리적인 요소로, 참(true)과 거짓(false) 이라는 값이 있습니다. 

 

 

 

• 특수 자료형

var 변수;   //undefined

var t = hello;

t=null;

위와 같이 undefined는 변수에 값이 등록되기 전의 기본값 입니다.

null은 변수에 저장된 값이 null인 경우를 말합니다. null은 변수에 저장된 데이터를 비우고자 할 때 사용하는 값입니다.

 

1. 널(null): 빈 값 입니다.

2. 미정의(undefined) : 값을 할당하지 않은 변수가 가지는 값 입니다.

 

• 복합 자료형

1. 객체: 값의 집합을 나타냅니다.

2. 배열: 순차적인 값의 집합을 나타냅니다.

3. 함수: 실행 가능한 코드가 담긴 특별한 객체 입니다.

---

 

2) 실제 스크립트 코드를 다룰 때 도움이 될만한 기준(상수와 변수)으로 값들을 분류

 

자료형(Data Type) : 연산에 사용되는 값의 종류

 

● 상수 : 값이 정해져 있는 형식

 

  1. 정수

    º  음수(-), 소수(.)를 제외한 양의 실수

    º  8진수, 16진수 포함

 

  2. 실수

    º  실제 사용 가능한 모든 수

 

 정수와 실수는 숫자 객체 : Number Object 입니다. 숫자 객체는 이것말고도 더 있어요. 

 

  3. 문자형 상수 (String)

    º  일반적인 텍스트

    º  ""사용

1+2는 3이 출력되지만 "1"+2 는 12라고 출력되며 문자열입니다. 

a=10, b=20 인 경우 document.write("a + b = " + a+b); 를 출력하면 "a+b=1020"이 라고 나옵니다. 
"a+b="이라는 문자열과 a가 먼저 더해져서 "a+b=10"이 되고 여기에 20이 더해져서 "a+b=1020"이 되는 것입니다.
문자열 + 정수 = 문자열
원하는 결과값을 도출하기 위해서는 괄호 ( )로 묶어주어 연산자 우선순위를 사용합니다.
document.write("a + b = " + (a+b) );

 

  4. 불린 (boolean)

    º  true(1) / false(0)의 형식

  

  5. null

    º  값이 없음

 

 

null에 대해 추가적으로 설명을 덧붙이자면,

프로그래밍을 하다보면 예를들어, '팝업창이 열려 있다면 팝업창을 다시 열지 말고, 팝업창이 없다면 새로운 팝업창을 열어라'와 같은 코딩을 하는 일이 있습니다. 이럴 경우 이렇게 팝업창이 '있다', '없다'라는 표현이 필요합니다. '없다'라고 표현할 때 스크립트에 'null'(없다)을 쓰면 됩니다. 

스크립트의 null 개념은 자바의 비어있다라는 'empty'(비어있다)의 개념처럼 쓰이고 있습니다. 차이는 있습니다. 비어있는 것과 없는 것은 다르니까요. 빵봉지가 있는 것과 빵봉지조차 없는 것은 다릅니다. 이렇게 엄연히 다른 것이지만 거의 같은 표현으로 쓰고 있습니다. 

대부분의 언어가 '없다'는 표현은 가지고 있습니다만 '있다'라는 표현을 가진 언어는 드뭅니다.

 

null의 반대는 not null 입니다.

'없다'라는 표현이 필요하면 null, '있다'라는 표현이 필요하면 not null 을 사용합니다.