[JavaScript] 자바스크립트의 자료형(Data Type)

자바스크립트(JavaScript)의 자료형

어떤 언어를 공부하든 기초로 자료형을 공부하게 됩니다. 자바스크립트는 조금은 특이한 자료형들을 가지고 있습니다. 자바스크립트에는 다음과 같은 자료형들이 있습니다.

자바스크립트는 기본데이터 타입인 boolean, number, string과 null, undefined 가 있고 이들을 제외하고는 모든 값들이 객체입니다. 자바스크립트에서의 null과 undefined는 그 자체로 값을 가지고 있습니다.

그러나 boolean, number, string은 객체처럼 다루는것이 가능하기 때문에 null과 undefined를 제외하면 모든 값들을 객체로 다룰 수 있습니다.

추가적으로 말하자면 자바스크립트는 굉장히 유연한 언어입니다. 조금만 잘못해도 컴파일시 수많은 오류를 내뿜는 Java같은 언어와는 달리 언어 자체적으로 지원하는 문법이 많고 조금은 문법이 틀리거나 수식이 틀려도 조건에 따라 맞다고 해주거나 하기때문에 자바스크립트에 대해 깨우치고 나면 굉장한 생산성으로 이어지지만 그렇지 못하면 헷깔리고 어려운 언어로 전락해버립니다. 이점 유의해주세요.

숫자 자료형(number)

자바스크립트는 정수나 실수 모두 number 타입임을 알 수 있는데, 이는 자바스크립트에서 모든 숫자값을 64비트 부동소수점으로 관리하기 때문입니다. java에서 integer, float 등으로 정수와 실수 타입을 구분하던것과는 달리 모든 숫자를 double 타입으로 저장하는것과 같습니다.

따라서 자바스크립트는 내부적으로 정수형이 없고 실수형만 존재하는것입니다. 만약 정수 나누기 연산을 하는경우 소숫점이 발생하면 버리는것이 아니고 그대로 소숫점까지 출력됨을 알 수 있습니다.

var num = 7 / 3;
console.log(num);   //2.3333333..

소숫점을 버리고 싶은 경우에는 두가지 방법을 사용합니다. 하나는 parseInt()를 통해 정수로 치환하는것이고 두번째는 Math.floor()를 이용하여 버림하는것입니다.

var num = 3.2234444;
 
console.log(parseInt(num)); //3 출력
console.log(Math.floor(num)); //3 출력

문자열(string)

자바에서는 문자열의 경우 큰따옴표(")를 사용해야 하지만 자바스크립트에서는 작은따옴표(')와 큰따옴표(") 모두 사용가능합니다.

var str1 = "dololak";
var str2 = 'dololak';

다만 작은따옴표와 큰따옴표 자기 자신을 중첩해 사용할 수 없으므로 역슬래시(\) 를 붙여 이스케이프 처리해주거나 감싸주는 쪽과 사용하는쪽을 반대로 사용해야 합니다. 예를 들어 문자열 중간에 큰따옴표를 넣어야 하는경우 작은따옴표로 문자열을 감싸는 형태입니다.

console.log("아이스 "아메리카노"");  //문법오류
console.log("아이스 \"아메리카노\"");  //아이스 "아메리카노"
console.log('아이스 "아메리카노"');   //아이스 "아메리카노"

자바스크립트에는 문자형(Char) 이 없다

자바스크립트는 Java나 C처럼 한글자만을 표현하는 문자 자료형이 없습니다. 따라서 한글자만을 표현하더라도 string을 사용해야 합니다.

var charType = "a";

또한 자바스크립트에서 문자열은 각 문자에 배열과 같이 인덱스를 통해 접근이 가능합니다.

var str = "dololak";
 
console.log(str[0]); //d
console.log(str[6]); //k

문자열은 변하지 않는다(immutable)

자바스크립트의 문자열은 불변(Immutable) 객체입니다. 즉 한 번 생성된 문자열 객체는 자신이 가진 값을 수정할 수 없습니다. 첫번째 글자인 'd' 를 변경하려 했으나 바뀌지 않았습니다.

var str = "dololak";
 
str[0] = "3";
console.log(str); //그대로 dololak 출력

아래는 str에 "good"을 넣었더니 바뀐 모습입니다.

str = "good";
 
console.log(str); //good

그러나 이것은 문자열 객체 자체가 변화한것이 아니라 새로 만들어진 문자열 객체의 주소값을 str에 넣은것 뿐 실제로 이전에 생성되었던 "dololak"이 변한것은 아닙니다.

참과 거짓 불린(boolean)형

자바스크립트는 true와 false 두가지 값을 불린 타입을 통해 표현합니다. 

var t = true;
var f = false;
 
console.log(typeof t ); //boolean
console.log(typeof f ); //boolean

또한 논리연산에서 자바 스크립트는  ‘ ’(빈 문자열), 0, NaN(Not a Number), null, undefined를 false로 취급하고 그 이외를 true로 취급합니다. 즉 아래와 같이 if문에 빈문자열 값을 넣으면 false로 동작합니다. 

var trueOrFalse = '';
 
if(trueOrFalse){
    console.log('true');
} else {
    console.log('false');
}

앞서 말한 0이나 NaN, null등을 넣어도 마찬가지이며 반대로 'a' 와 같이 특정 값이나 boolean형인 true 자체 그리고 참이 되는 표현식은 true입니다. 위 예제의 trueOrFalse 에 다음을 각각 대입하면 true가 출력됩니다.

1 == 1 //true
'a' //true
true //true

null 그리고 undefined

자바스크립트에서는 값이 없다는 것을 null과 undefined로 나타냅니다. 특이하게도 자바스크립트에서 이 둘은 의미를 떠나서 실제 어떤 값을 가지고 있습니다.

null은 object 타입입니다. undefined는 undefined타입이며, 객체가 아닌 undefined라는 값을 가지고 있습니다.

var nullVal = null;
var undefVal;
 
console.log(typeof nullVal); //object
console.log(typeof undefVal); //undefined

이 둘의 차이점이 있다면 undefined는 변수를 선언하고 값을 할당하지 않은 상태이며, null의 경우에는 프로그래밍시에 명시적으로 값을 비우는 경우 사용합니다.

var str = 'good';
str = null;
 
console.log(str); //null

객체 타입(참조 타입)

자바스크립트에서 앞서 소개한 string, boolean, number, null, undefined 를 제외한 모든 변수는 객체타입입니다. 우리가 직접 만들어낸 객체나 함수도 객체입니다.

그중에 자바스크립트는 함수 자체도 function 타입의 객체로서 변수에 할당을 하거나 다른 함수의 매개변수로 전달도 가능합니다.

var func = function() {
    console.log('hello World');
}
 
 
console.log(typeof func); //function

객체지향 언어인 C++, C#, Java등을 공부한 전공자라면 자바스크립트의 객체 개념에서 잠시 혼란이 오는데, 자세한 부분은 이후에 알아보도록 합니다. 

자바스크립트에서 객체를 생성하는 방법에는 여러가지가 있지만 Object() 함수를 통해서 생성이 가능하며, 클래스 개념이 명확한 Java 등과는 다르게, 런타임(실행중)에 필드 할당이 가능합니다.

var myObj = new Object();
 
myObj.age = 13;
myObj.name = 'dololak';
 
console.log(myObj); // {age: 13, name: "dololak"}
console.log(typeof myObj); // object