JavaScript를 사용하여 바이트를 기가 바이트로 변환

Nithin Krishnan 2023년10월12일
  1. 10 진수로 변환
  2. 바이너리베이스로 변환
JavaScript를 사용하여 바이트를 기가 바이트로 변환

기가 바이트에 몇 바이트가 있는지 궁금한 적이 있습니까? 기가 바이트는 일반적으로 사용되는 측정 단위입니다. 기가 바이트는 영화의 세계 파일 크기, 하드 디스크의 용량, 심지어 우리가 기가 바이트로 나타내는 노트북이나 휴대폰의 랜덤 액세스 메모리 크기까지도 널리 사용됩니다. 이 문제를 해결하는 데 사용되는 이러한 경우의 모든 단위는 기가 바이트입니다. 바이트를 기가 바이트로 변환하려면 약간의 수학이 필요합니다. 미터를 킬로미터로 변환하는 것과 유사합니다. JavaScript로 변환하는 방법을 살펴 보겠습니다. 바이트를 기가 바이트로 변환하는 방법은 다음과 같습니다.

  1. 기가 바이트를 10 진수로 바이트로 변환
  2. 바이너리베이스에서 기가 바이트를 바이트로 변환

10 진수로 변환

모든 사람에게 가장 일반적인 의심은 킬로바이트 값이 1024 바이트인지 1000 바이트인지입니다. Google에서 검색 할 때 우리는 혼합 된 반응을 얻습니다. 그러나 기본 개념은 간단합니다. 10 진수 시스템에서 1KB 값은1000바이트 인 반면 2 진수 시스템에서는 값이1024바이트입니다. 따라서 변환 매개 변수는이 이념에 따라 변경됩니다.

소수점 기준으로 변환하는 이유

설명을 시작하기 전에 주요 변환 단위를 살펴 보겠습니다. 십진수 밑수를 다룰 때 다음과 같은 변환 근거를 사용합니다.

  • 1 킬로바이트 = 1000 바이트
  • 1 메가 바이트 = 1000 킬로바이트
  • 1 기가 바이트 = 1000 메가 바이트

따라서 1 기가 바이트 = 1000 * 1000 * 1000 바이트입니다. 즉, 1 기가 바이트는 9 (10 ^ 9) 바이트의 거듭 제곱의 10에 해당합니다. 따라서 Google에서1 GB를 검색하면1e+9와 같은 표현이 제공됩니다. 1e+99 0이있는1과 같습니다. 이것이 변환 계산의 요점입니다.

변환 코드

이제 우리는 변환 뒤에있는 계산과 다양한 바이트 단위를 이해했습니다. 입력으로 주어진 숫자 (바이트 수)를 변환하기 위해 JavaScript 코드를 빠르게 살펴 보겠습니다. 코드는 이에 상응하는 기가 바이트 값을 반환하고 화면에 표시합니다.

<h3><center>Byte to GB</center></h3>
<div>
    <center>
        <input type="text" id="bytes_input"><label>Bytes</label>
    </center>
</div>
<div>
    <center>
        <button onclick="convertToGB()">Convert</button>
        <button onclick="reset()">Reset</button>
    </center>
</div>
<center>
    <div>
        <label>Result: </label> <label id="gbValue">0</label> GB
    </div>
</center>
window.onload =
    function() {
  reset();
  updateDisplay(0);
}

function convertToGB() {
  let bytesValue = document.getElementById('bytes_input').value;
  let gbValue = (bytesValue / (1000 * 1000 * 1000)).toFixed(2);
  updateDisplay(gbValue);
}

function reset() {
  document.getElementById('bytes_input').value = 0;
  updateDisplay(0);
}


function updateDisplay(val) {
  document.getElementById('gbValue').innerHTML = val;
}

단계는 다음과 같습니다.

  • 사용자로부터 바이트 수를 캡처하는 HTML GUI를 디자인합니다. GUI에는ConvertReset버튼이 있습니다. Convert버튼을 주어진 바이트 값을 기가 바이트로 변환하는convertToGB()함수에 바인딩합니다. Reset버튼은reset()함수와 결합되어 사용자가 새로운 값을 변환 해 볼 수 있도록 값을 재설정합니다.
  • 코드 실행은window.onload()함수로 시작됩니다. window.onload()함수는 페이지가로드 될 때 실행되는 첫 번째 함수입니다. 이 함수에서는 입력 및 출력 기가 바이트 값을 0으로 재설정합니다.
  • 사용자가 바이트 값을 입력하고변환버튼을 클릭하면convertToGB()함수가 트리거됩니다.
  • convertToGB()함수에서 javascript의document.getElementById("bytes_input").value함수를 사용하여 사용자가 바이트 필드에 입력 한 값을 캡처하고 bytesValue변수. 다음 단계에서는bytesValue(1000 * 1000 * 1000)로 나누어 해당 바이트 값을 기가 바이트로 변환합니다. 기억하십시오. 바이트 값을 1000으로 나누면 킬로바이트 값을 얻을 수 있습니다.이 값을 천으로 더 나누면 메가 바이트 값이 반환되고 메가 바이트 값을 나누면 바이트에 대한 기가 바이트 표현이됩니다.
  • 이러한 계산을 수행하고 결과를gbValue변수에 저장합니다. 다음 줄에서는document.getElementById("gbValue").innerHTML을 사용하여label값을 설정하여 GUI에gbValue를 표시합니다. 따라서 변환 된 값은 HTML에 표시됩니다.

비고

  • 본질적으로 7 자리 이상의 값을 가진 바이트가 이에 상응하는 유형의 기가 바이트를 얻기 위해 필요합니다. 최소 출력 값은0.01 GB이며10000000 Bytes로 변환됩니다. 즉, 위 코드를 사용하면10000000 Bytes보다 큰 값을 가진 바이트가 출력에 표시됩니다. 그보다 작은 값에 대한 출력은0 GB가됩니다.
  • JavaScript에서 변수가 담을 수있는 자릿수에 제한이 있습니다. JavaScript에는 숫자 변수가 JavaScript에서 보유 할 수있는 최대 값인9007199254740991을 정의하는 상수Number.MAX_SAFE_INTEGER가 있습니다. 따라서 코드는 그 이상의 바이트 수를 Gigabytes 표현으로 변환하지 않습니다. 변환하는 동안 정밀도가 떨어질 수 있습니다. 권장하지 않습니다.
  • 위에서 본 코드에 따르면 출력 값은 소수점 이하 두 자리로 반올림 된 값을 표시합니다. JavaScript의Number.toFixed()함수를 사용합니다. (bytesValue / (1000 * 1000 * 1000)).toFixed(2)행에 따라 출력은 소수점 2 자리가됩니다. 더 나은 정밀도로 기가 바이트 값을 표시하면 요구 사항에 따라.toFixed(3)또는.toFixed(4)로 코드를 조정할 수 있습니다.

바이너리베이스로 변환

바이트 값을 기가 바이트로 변환하는 더 일반적으로 이해되는 방법은 이진 기본 값을 사용하는 것입니다. 우리 대부분은1024단위 값을 알고 있습니다. 1000으로 나누는 십진법과는 달리, 더 높은 바이트 단위로 변환하기 위해, 이진수 시스템에서는1024인자로 나눕니다.

바이너리베이스를 사용한 변환 기준

변환 코드를보기 전에 이진수 시스템의 변환 단위 값을 살펴 보겠습니다. 여기서 이론적 근거는1024를 중심으로 회전합니다 (즉,210).

  • 1 킬로바이트 = 1024 바이트
  • 1 메가 바이트 = 1024 킬로바이트
  • 1 기가 바이트 = 1024 메가 바이트

따라서 바이너리 기본 시스템에서 1 GigaByte = 1024 * 1024 * 1024 Bytes입니다. 바이트 숫자 값을 Gigabyte로 변환하려면1024 * 1024 * 1024로 ​​나누어야합니다.

변환 코드

다음 코드는 바이너리 시스템에서 바이트 수를 기가 바이트 표현으로 변환합니다.

<h3><center>Byte to GB</center></h3>
<div>
    <center>
        <input type="text" id="bytes_input"><label>Bytes</label>
    </center>
</div>
<div>
    <center>
        <button onclick="convertToGB()">Convert</button>
        <button onclick="reset()">Reset</button>
    </center>
</div>
<center>
    <div>
        <label>Result: </label> <label id="gbValue">0</label> GB
    </div>
</center>
window.onload =
    function() {
  reset();
  updateDisplay(0);
}

function convertToGB() {
  let bytesValue = document.getElementById('bytes_input').value;
  let gbValue = (bytesValue / (1024 * 1024 * 1024)).toFixed(2);
  updateDisplay(gbValue);
}

function reset() {
  document.getElementById('bytes_input').value = 0;
  updateDisplay(0);
}


function updateDisplay(val) {
  document.getElementById('gbValue').innerHTML = val;
}

십진법 시스템 변환이있는 코드와 비교할 때 여기서 유일한 차이점은(bytesValue / (1024 * 1024 * 1024)).toFixed(2) 줄에서 분명한1000대신1024인수를 사용한다는 것입니다.

비고

  • 입력 가능한 최대 개수 범위에 대해서도 동일한 제한이 적용됩니다. 9007199254740991보다 큰 숫자는 성공적인 변환을 보장하지 않습니다.
  • (bytesValue / (1024 * 1024 * 1024)).toFixed(2)줄에서toFixed()함수의 매개 변수를 변경하여 정밀도를 조정할 수 있습니다. 일반적으로 대부분의 경우 소수점 뒤에 2 자리 또는 3 자리 숫자가 선호됩니다.
  • 결과는 둘 다 변환, 10 진수 변환 및 2 진수 변환에서 다를 수 있습니다. 두 방법 간의 비교는 사과와 오렌지를 비교하는 것과 같으므로 유효하지 않습니다. 결과는 각 숫자 기반 시스템에 있습니다. 즉, 바이트를 기가 바이트로 변환하는 10 진수 기본 시스템에서 결과는 10 진수 시스템에서 기가 바이트 표현이되고 2 진수 기본 시스템의 경우 그 반대의 경우도 마찬가지입니다.