웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리

HOME > js

자바스크립트 숫자 값을 binary로 변환하기

Last Modified : 2021-07-12 / Created : 2021-06-29
5,342
View Count

자바스크립트에서 숫자를 더하거나 빼는 연산을 수행할 경우 엔진에서 binary64로 변환하는 과정을 거치게 됩니다. 이 방법은 다른 언어에서도 많이 사용되며 IEEE754를 기반으로 숫자를 표현하고 연산하기 때문이죠.

그렇다면 자바스크립트에서 binary number(이진법 숫자)를 얻기 위한 방법은 무엇일까요? 아래에서 알아봅니다.


! binary number는?

binary(2진법, 바이너리)는 decimal(10진법)과 다르게 on / off(0 또는 1)처럼 표기되어 사용됩니다. 예를들어 아래의 숫자는 다음과 같이 binary로 변경될 수 있습니다.


==============
|| decimal  |  binary ||
--------------------------
0 | 0
1 | 1
2 | 10
5 | 101
10 | 1010
1000 | 1111101000
...




# 자바스크립트에서 binary 변환하는 방법


만약 자바스크립트 부동 소수점 숫자를 2진법 숫자인 binary로 변환하려면 어떻게 해야 할까요? 잘 알려진 방법은 아래 방법처럼 toString(2)을 사용하는 방법이 많이 사용됩니다. 먼저 간단하게 예를 하나 들어보겠습니다.

아래의 변수 myNum은 0.2의 값을 가지고 있습니다. 이 값을 바이너리로 변환할 경우 toString(2)를 사용해보도록 하겠습니다.
myNum = 0.2;

myNum.toString(2);
// 출력결과
'0.001100110011001100110011001100110011001100110011001101'

출력결과를 보면 연속된 0과 1의 숫자들이 문자열로 나타납니다. 이처럼 쉽게 binary로 변환된 값을 얻을 수 있습니다. 추가로 아래와 같이 사용하는 경우 원하는 결과가 나타나지 않고 문법 에러가 발생합니다.
5.toString(2);
// Uncaught SyntaxError: Invalid or unexpected token


문제는 숫자 뒤의 점 때문에 연산에 에러가 발생하기 때문입니다. 이를 수정하여 아래처럼 사용할 수 있습니다.
5..toString(2);
(5).toString(2);
parseInt(5).toString(2);

// 실행결과
"101"

모두 동일하게 "101"을 출력하게 됩니다.


! 소수점 연산시 문제점 해결하기


아까 얘기한 것 처럼 binary 변환 과정으로 부동 소수점 연산이 기대한 값과 다를 수 있습니다. 예를들어 만약 0.2 + 0.1을 더하면 아래와 같이 출력됩니다.
0.2 + 0.1

// 출력결과
0.30000000000000004

예상한 0.3이 나타나지 않습니다. 그렇다면 이를 해결하기 위해서 자바스크립트에서 부동 소수점 연산시 어떻게 해야 할까요? 이 경우 반올림을 사용하는 방법이 많이 쓰입니다.

Number.toFixed()


toFixed()는 해당 자리수로 반올림처리를 수행합니다. 이제 이 방법을 사용하여 결과를 알아봅니다.
sum = 0.2 + 0.1;

sum.toFixed(1);
// 0.3을 문자로 출력함

원하는 결과를 얻을 수 있었습니다. 다른 방법도 있습니다. 자바스크립트의 Math API를 사용할 수 있으며  Math.round()를 사용하거나 아니면 다른 방법으로 decimal.js, math.js 등의 라이브러리를 사용하기도 합니다.

아래의 글도 찾고 계시지 않나요?

Previous

자바스크립트에서 쿼리스트링을 객체, object로 변환하기

Previous

[자바스크립트] in 연산자 사용하는 방법과 응용