Javascript (자바스크립트) - 데이터 타입

자바스크립트에서 사용하는 데이터의 종류에는 크게 6가지가 있다.

 

1. 숫자 (Number)

2. 문자 (String)

3. 참, 거짓 (Boolean)

4. 객체 (Object)

5. undefinded

6. null

 

1. 각 데이터 입력 방법

- 숫자 (Number)

var number = 123;

 

- 문자 (String) : 문자형은 반드시 따옴표로 감싸줘야 한다.

var str = "String";

 

- 참, 거짓 (Boolean) : true(참)은 1, false(거짓)은 0이다.

var bool = true;  // 참
var bool = false;  // 거짓

 

- 객체 (Object)

var obj = {
   id : "abcdqbbq",
   phonenum : 01012345678
};

 

2. undefinded vs null

undefinded와 null은 둘 다 값이 없음을 나타낸다.

둘 다 아무런 값이 없는 상태인데 왜 다르게 사용이 된건지에 대한 의문이 많이 있을 것이다.

 

둘을 비교해보자면

 

undefinded는 정말로 아무런 값이 선언되지 않은 값이고

null은 명시적으로 값이 비었음을 나타내는 무의미한 '빈 값'이다.

var test;  // 변수에 값이 없으므로 undefinded 출력

var test2 = null;  // null을 값으로 넣었으므로 빈 값이지만 null 출력

그래서 null 값의 경우 특정 변수나 함수에서 일부러 임의의 빈 값을 넣을 때 사용된다.

 

3. 데이터 타입 비교

내가 사용한 데이터가 어떤 형식인지를 확인하기 위해서는

typeof 를 사용하면 된다.

그럼 해당 변수가 어떤 데이터 타입을 갖고 있는지 알 수 있다.

var num = 123;
var str = "String";
var bool = true;
var obj = {
   id : "abcdqbbq",
   phonenum : 01012345678
};
var test;
var test2 = null;

console.log(typeof num); // number 출력
console.log(typeof str); // string 출력
console.log(typeof bool); // boolean 출력
console.log(typeof obj); // object 출력
console.log(typeof test); // undefinded 출력
console.log(typeof test2); // null 출력

 

4. 데이터 타입 변환(암시적 변환)

문자면 문자 숫자면 숫자, 정해진 데이터 타입에서 특정 경우에는

데이터 타입이 변경이 된다. 

예를들면 문자 + 숫자, 숫자 + 참,거짓이 연산이 되면 

데이터 타입이 변경 된다.

var num = 123;
var str = "String";
var bool = true;

var numnum = num + num;  // 246, typeof : number
var numstr = num + str;  // "123String", typeof : string
var numbool = num + bool;  // 124, typeof : number
var strbool = bool + str;  // "trueString", typeof : string
var boolbool = bool + bool;  // 2, typeof : number

var numstrbool = num + str + bool;  // "123Stringtrue", typeof : string
var numboolstr = num + bool + str;  // "124String", typeof : string

var numboolMulti = num * bool;  // 123, typeof : number
var numstrMulti = num * str;  // NaN, typeof : number

위의 소스를 살펴보면 몇 가지 데이터 타입의 특징을 알 수 있다.

 

1. number + string = string이 된다.

2. number + boolean은 boolean의 1(true) 혹은 0(false) 에 의해 숫자와 만나면 연산이 된다.

3. boolean + string = string이 된다.

4. boolean + boolean =  number이 된다.

5. number + string + boolean = string이 되지만

   number + boolean + string은 number와 boolean의

   연산된 값과 string이 더해진 상태로 string이 된다.

6. number * boolean은 연산이 되고, number이 된다.

7. number * string은 연산이 되지 않고 NaN(Not a number)라는 값이 나타난다.

NaN (Not a number)은 숫자형(number)이다.

 

라는 몇 가지 특징이 나타난다.

여기서 유심히 살펴볼 것은 string이 더해지면 결국엔 다 string이 되고

string은 * 연산이 적용되지 않고 number 혹은 boolean은 * 연산이 적용된다는 사실을 알 수 있다.

 

5. 데이터 타입 변환(명시적 변환)

특정한 연산에 의해 자연스레 타입이 변경되는 것이 아니라

특정 함수를 사용하여 명시적으로 타입을 변환할 수 있다.

 

- String() : 숫자를 문자형으로 변환한다.

- toString() : 숫자를 문자형으로 변환한다.

- Number() : 문자형을 숫자형으로 변환한다.

- parseInt() : 문자형을 정수로 변환한다.

 

var num = 123;
var str = "123";
var str1 = "string";
var bool = true;

var numToStr = String(num);  // "123", typeof : string
var numToStr2 = num.toString();  // "123", typeof : string

var boolToNum = Number(bool);  // 123, typeof : number
var strToNum = Number(str);  // 123, typeof : number
var strToNum2 = Number(str1);  // NaN, typeof : number

var strToNum1 = parseInt(str);  // 123, typeof : number

여기서 주목할 점은 Number(str)은 숫자형으로 변경이 되었지만

Number(str1)은 NaN이 나오는 것을 볼 수 있다.

 

str의 값은 "123", str1의 값은 "string"이 담겨있었는데,

문자형이라 하여도 따옴표 안에 숫자가 담겨있었으면 Number() 함수를 이용해서

숫자형으로 변경할 수 있지만

문자가 하나라도 들어가 있으면 숫자형으로 변경할 수 없다는 사실을 알 수 있다.