使用 JavaScript 將位元組轉換為千兆位元組

Nithin Krishnan 2023年1月30日 2021年7月3日
  1. 轉換為十進位制基數
  2. 轉換為二進位制基數
使用 JavaScript 將位元組轉換為千兆位元組

你有沒有想過一個千兆位元組有多少位元組?千兆位元組是常用的計量單位。千兆位元組廣泛用於我們日常電影的世界檔案大小、硬碟容量,甚至膝上型電腦或手機中隨機存取儲存器的大小,我們都用千兆位元組表示。在這些情況下,用於解決這些問題的所有單位都以千兆位元組為單位。將位元組轉換為千兆位元組需要一些數學知識。它類似於將米轉換為公里。讓我們看看如何在 JavaScript 中進行轉換。有幾種將位元組轉換為千兆位元組的方法,如下所示。

  1. 以十進位制為單位將千兆位元組轉換為位元組
  2. 將千兆位元組轉換為二進位制基位元組

轉換為十進位制基數

每個人最常見的疑問是千位元組值是 1024 位元組還是 1000 位元組。在 Google 中搜尋時,我們得到的反應不一。但基本概念很簡單。在十進位制數字系統中,一千位元組值是 1000 位元組,而在二進位制數字系統中,該值是 1024 位元組。因此,轉換引數會根據這種意識形態而改變。

十進位制轉換的基本原理

在開始解釋之前,我們先來看看轉換單位。當我們處理十進位制數基時,我們將使用以下轉換原理。

  • 1 千位元組 = 1000 位元組
  • 1 兆位元組 = 1000 千位元組
  • 1 GB = 1000 兆位元組

因此,1 GB = 1000 * 1000 * 1000 位元組。換句話說,一 GigaByte 相當於 10 的 9 (10^9) 位元組的冪。因此,在谷歌中簡單地搜尋 1 GB 會給我們一個類似於 1e+9 的表示。1e+9 等於 19 個零。這就是轉換計算的要點。

轉換程式碼

我們現在已經瞭解了轉換背後的計算和位元組的各種單位。讓我們快速瀏覽 javascript 程式碼以轉換作為輸入給出的數字(位元組數)。該程式碼將為其返回 Gigabyte 等效值並將其顯示在螢幕上。

<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 有一個 Convert 和一個 Reset 按鈕。我們將 Convert 按鈕繫結到 convertToGB() 函式,該函式將給定的位元組值轉換為千兆位元組。Reset 按鈕與 reset() 函式繫結以重置值,以便使用者可以嘗試轉換較新的值。
  • 程式碼的執行從 window.onload() 函式開始。window.onload() 函式是頁面載入時第一個執行的函式。在此函式中,我們將輸入和輸出 Gigabyte 的值重置為 0。
  • 一旦使用者輸入一個位元組值並點選 Convert 按鈕,convertToGB() 函式就會被觸發。
  • convertToGB() 函式中,我們使用 javascript 的 document.getElementById("bytes_input").value 函式捕獲使用者在位元組欄位中輸入的值,並將其捕獲在 bytesValue 變數。在下一步中,我們通過將 bytesValue 除以 (1000 * 1000 * 1000) 將該位元組值轉換為千兆位元組。請記住,將位元組值除以 1000 得到千位元組值,再將其除以千返回兆位元組值,而將兆位元組值除以我們得到位元組的千兆位元組表示。
  • 我們進行這些計算並將結果儲存在 gbValue 變數中。在下一行中,我們通過使用 document.getElementById("gbValue").innerHTML 設定 label 值將 gbValue 顯示到 GUI 中。因此轉換後的值顯示在 HTML 中。

評論

  • 本質上,我們需要一個位元組的值超過七位才能獲得有形的 Gigabyte 等價物。最小輸出值為 0.01 GB,轉換為 10000000 Bytes。這意味著使用上面的程式碼,值大於 10000000 Bytes 的位元組將顯示在輸出中。小於該值的輸出將為 0 GB
  • javascript 中變數可以容納的位數是有限制的。JavaScript 有一個常量 Number.MAX_SAFE_INTEGER,它定義了一個數字變數可以在 javascript 中儲存的最大值,即 9007199254740991。因此,程式碼不會將任何位元組數轉換為千兆位元組表示。我們可能會在轉換過程中失去精度。我們不推薦它。
  • 根據我們上面看到的程式碼,輸出值顯示四捨五入到兩位小數的值。我們使用 JavaScript 的 Number.toFixed() 函式。根據行 (bytesValue / (1000 * 1000 * 1000)).toFixed(2),輸出將是 2 個小數位。如果我們以更好的精度顯示千兆位元組值,我們可以根據要求使用 .toFixed(3).toFixed(4) 調整程式碼。

轉換為二進位制基數

將位元組值轉換為千兆位元組的更普遍理解的方法是使用二進位制基數。我們大多數人都知道 1024 單位值。與十進位制系統中除以 1000 不同,為了轉換為更高的位元組單位,在二進位制數系統中,我們除以 1024 因子。

使用二進位制基數轉換的基數

在檢視轉換程式碼之前,讓我們先看看二進位制數字系統中的轉換單位值。這裡的基本原理將圍繞 1024(即 2 的 10 次方或 210)。

  • 1 千位元組 = 1024 位元組
  • 1 兆位元組 = 1024 千位元組
  • 1 GB = 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;
}

與使用十進位制基數系統轉換的程式碼相比,這裡唯一的區別是我們使用 1024 因子而不是 1000,這可以從 (bytesValue / (1024 * 1024 * 1024)).toFixed(2) 行中看出來。

評論

  • 對於可輸入的最大數字範圍,同樣的限制適用於該方法。大於 9007199254740991 的數字不能保證成功轉換。
  • 我們可以通過更改 (bytesValue / (1024 * 1024 * 1024)).toFixed(2) 行中 toFixed() 函式的引數來調整精度。通常,在大多數情況下,小數點後最好使用 2 或 3 位數字。
  • 兩種轉換的結果可能不同,十進位制基數轉換和二進位制基數轉換。兩種方法之間的比較是無效的,因為它就像比較蘋果和橘子一樣。結果在各自的數字基礎系統中。這意味著,在將位元組轉換為千兆位元組的十進位制基本系統中,結果將是十進位制數字系統中的千兆位元組表示,反之亦然。