본문 바로가기

프론트엔드/JavaScript

자바스크립트 데이터 타입 (JavaScript Data Type)

자바스크립트 데이터 타입 (JavaScript Data Type)

자바스크립트 데이터 타입에 관해 공부했다.

내가 몰랐거나 중요하다고 생각되는 부분을 정리하면서 다시 한번 되새긴다.

실수 처리

자바스크립트는 2진수, 8진수, 16진수를 표현하기 위한 데이터 타입을 제공하지 않는다.

그래서 2진수, 8진수, 16진수의 값을 변수에 할당해도 해석될 때는 모두 10진수로 해석된다.

예를 들면 아래와 같다.

var binary = 0b01000001; // 2진수
var octal = 0o101; // 8진수
var hex = 0x41; // 16진수

console.log(binary); // 65
console.log(octal); // 65
console.log(hex); // 65

모든 수를 실수로 처리한다는 자바스크립트의 재미있는(?) 특성 덕분에 아래와 같은 결과가 나타난다.

console.log(1 === 1.0); // true

우리가 변수에 1이라는 값을 할당하고 그것의 출력 값이 1로 보인다고 해도, 실제로 그 수는 정수가 아닌 실수인 것이다. 옛날에 이것과 관련해서 잠깐 애를 먹었던 기억이 있는데 정확히 어떤 상황이었는지 떠오르지가 않는게 좀 아쉽다. 그런 경험들은 앞으로 잘 기록해 놓아야겠다.

또 하나 알고리즘을 공부하면서 출력 값을 테스트 하면서 재미있는 것을 발견했다.

console.log(-0); // -0
conosle.log(0); // 0
console.log(-0 === 0); // true

실행 환경에 따라 다르다고 하는 말을 듣긴 했는데 0에 -를 붙이면 그대로 -0이 출력된다.

(-)부호가 붙지 않은 0과 비교하면 true가 찍히는데, 알고리즘의 출력과 관련해서 0이 답으로 나와야 할 때 -0이 나오면 오답으로 처리될 수 있으니 주의해야 한다.

undefined

자바스크립트에서 변수를 선언하고 값을 따로 할당하지 않으면 암묵적으로 값이 undefined로 초기화 된다.
물론 이 undefined도 아래와 같이 변수에 의도적으로 할당할 수 있다.

var foo = undefined;
console.log(foo); // undefined

중요한 것은 undefined의 목적이 개발자가 의도적으로 할당하기 위한 값이 아니라, 자바스크립트 엔진이 변수를 초기화 할 때 사용하는 값이라는 사실이다.

따라서 개발자가 의도적으로 변수에 할당한다면, 본래 취지와 어긋날 뿐더러 혼란을 줄 수 있으므로 권장하지 않는다.

변수 선언 후에 초기화 하지 않으면 변수의 초기 값이 undefined로 할당된다는 것은 알고 있었지만, undefined에 대해서 큰 고민을 해본 적은 없었다. 그래서 코드를 작성할 떄 undefined라는 값을 변수에 의도적으로 할당한 적도 있었다. 특히 TypeScript를 사용할 때 그러한 경우가 많았다.

실무에서 React와 TypeScript를 함께 사용하고 있는데 아래와 초기 값을 명시해 주지 않으면, 변수의 타입이 number | undefined 로 설정된다.

const [input, setInput] = useState<number>();

앞으로 값을 비워주어야 할 때는 undefined를 다시 변수에 할당하기 보다는, null을 할당해서 의미를 더 명확히 하도록 코드를 작성해야겠다.

자바스크립트는 동적 타입 언어

자바스크립트는 변수의 선언할 때가 아닌 할당에 의해 타입이 결정된다. 그리고 값 재할당에 의해 변수의 타입은 언제든지 동적으로 변할 수 있다.

그래서 말장난 같이 들릴 수도 있지만, 변수는 타입을 갖지 않는다. 값이 타입을 갖는 것이다.
이러한 특징은 자바스크립트가 유연하다고 느끼게 해주는 것 같기도 하지만 여러 단점도 역시 같이 존재하는 것 같다.


프로그램이 복잡해질 수록 계속해서 변화하는 변수 값을 정확히 추적하기 어려울 수 있다는 점, 그래서 변수의 값을 확인하기 전까지는 타입을 확신할 수 없다는 불안감. 이러한 이유 때문에 타입 확인을 위한 코드를 작성해야 할 때도 있는데 이는 번거롭기도 하고 코드의 양도 증가시킨다.


또 자바스크립트는 우리의 의도와 상관 없이 타입이 자동으로 변환될 때가 있다.
아래 코드에 예를 들어보겠다.

const a = "10";

console.log(typeof a); // string
console.log(a / 5); // 2

분명히 a에는 문자열 10을 할당했다. typeof 연산자로 a의 타입을 확인해 보아도 string 타입인 것을 확인할 수 있다.

하지만 string타입인 변수 a를 number타입인 5로 나누자 기가막히게도 2라는 값이 출력된다.

이처럼 자바스크립트는 유연성은 높지만 우리가 예상했던 것과는 다른 결과를 만나게 될 수도 있다.
타입스크립트를 사용하면 자바스크립트의 신뢰성이 떨어지는 부분을 상당 부분 해결할 수 있는 것 같다.
갑자기 타입스크립트를 광고하는 것이 좀 웃기긴 하지만 여하튼 그렇다.

물론 모든 사람이 타입스크립트를 좋아하는 것은 아닌 것 같지만, 지금까지 나의 타입스크립트 사용 경험은 꽤나 만족스럽다.