10진수, 2진수, 8진수, 16진수
10진수 → 2 , 8, 16 진수 변환 예시
참조
toString(2) : 2진수 변환
toString(8) : 8진수 변환
toString(16) : 16진수 변환
let num = 8;
// 10->2
let num2 = num.toString(2); // 0000 1000
// 10->8
let num8 = num.toString(8); // 10
//10->16
let num16 = num.toString(16); // 8
2진수 → 10 , 8, 16 진수 변환 예시
참조
2진수는 parseInt(값, 2)하여 숫자형으로 변환 후 진수 변환을 하여야 한다.
let bin = "00001000";
// 2->10
let num10 = parseInt(bin,2); // 8
// 2->8
let num8 = parseInt(bin,2).toString(8); // 10
// 2->16
let num16 = parseInt(bin,2).toString(16); // 8
8진수 → 10 , 2, 16 진수 변환 예시
참조
8진수는 parseInt(값, 8)하여 숫자형으로 변환 후 진수 변환을 하여야 한다.
let oct = "10";
// 8->10
let num10 = parseInt(oct,8); // 8
// 8->2
let num2 = parseInt(oct,8).toString(2); // 00001000
// 8->16
let num16 = parseInt(oct,8).toString(16); // 8
16진수 → 10 , 2, 8 진수 변환 예시
참조
16진수는 parseInt(값, 16)하여 숫자형으로 변환 후 진수 변환을 하여야 한다.
let hex = "15a";
// 16->10
let num10 = parseInt(hex,16); // 346
// 16->2
let num2 = parseInt(hex,16).toString(2); // 101011010
// 16->8
let num8 = parseInt(hex,16).toString(8); // 532
사용자 입력값으로 진수 변환 예제
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<table>
<tr>
<th>10진수</th>
<td><input type="text" id="num" size="10" value="">
<button type="button" onclick="num()">변환</button></td>
</tr>
<tr>
<th>2진수</th>
<td><input type="text" id="bin" size="10" value="">
<button type="button" onclick="bin()">변환</button></td>
</tr>
<tr>
<th>8진수</th>
<td><input type="text" id="oct" size="10" value="">
<button type="button" onclick="oct()">변환</button></td>
</tr>
<tr>
<th>16진수</th>
<td><input type="text" id="hex" size="10" value="">
<button type="button" onclick="hex()">변환</button></td>
</tr>
</table>
<script type="text/javascript">
function num() {
let num = parseInt(document.getElementById('num').value);
let num2 = num.toString(2);
document.getElementById('bin').value = num2;
let num8 = num.toString(8);
document.getElementById('oct').value = num8;
let num16 = num.toString(16);
document.getElementById('hex').value = num16;
}
function bin() {
let bin = parseInt(document.getElementById('bin').value,2);
// 2->10
document.getElementById('num').value = bin;
// 2->8
let bin8 = bin.toString(8);
document.getElementById('oct').value = bin8;
// 2->16
let bin16 = bin.toString(16);
document.getElementById('hex').value = bin16;
}
function oct() {
let oct = parseInt(document.getElementById('oct').value,8);
// 8->10
document.getElementById('num').value = oct;
// 8->2
let oct2 = oct.toString(2);
document.getElementById('bin').value = oct2;
// 8->16
let oct16 = oct.toString(16);
document.getElementById('hex').value = oct16;
}
function hex() {
let hex = parseInt(document.getElementById('hex').value,16);
// 16->10
document.getElementById('num').value = hex;
// 16->2
let hex2 =hex.toString(2);
document.getElementById('bin').value = hex2;
// 16->8
let hex8 = hex.toString(8);
document.getElementById('oct').value = hex8;
}
</script>
</body>
</html>
실행화면
| 10진수 | |
|---|---|
| 2진수 | |
| 8진수 | |
| 16진수 |
'IT > JavaScript' 카테고리의 다른 글
| [Html+JavaScript] 정답을 입력받고 경고창으로 정답 확인하기/조건문/alert (0) | 2021.06.06 |
|---|---|
| [Html+JavaScript] 사진 클릭 시 경고창 띄우기/alert (0) | 2021.06.06 |
| [Html+JavaScript]Date()사용법/날짜,시간 설정하기(setter)/년,월,일,요일,시,분,초 출력하기(getter)(feat.Dom) (0) | 2021.06.06 |
| [Html+JavaScript]1초당 갱신되는 시계 만들기(feat.Dom)/setInterval()/Date() (0) | 2021.06.06 |
| [Html+JavaScript] getElementById()/onclick사용법(feat.Dom) (0) | 2021.06.06 |