n進数を変換したい | 数値操作 | JavaScript 目的別リファレンス

現在作成中です。今後加筆修正してまいります。
スポンサーリンク

このプログラムでは、toString()メソッドを使用して、指定した数値を2進数、8進数、16進数に変換します。

スポンサーリンク

n進数を変換するプログラム

以下のコードでは、数値255を2進数、8進数、16進数に変換し、その結果を表示しています。

HTMLとJavaScriptコード

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>n進数を変換する方法</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            line-height: 1.6;
            padding: 20px;
        }
        pre {
            background: #f4f4f4;
            border-left: 3px solid #ccc;
            padding: 10px;
            margin: 20px 0;
        }
    </style>

    <script>
        window.onload = function() {
            // n進数への変換を行う関数
            function convertToBase(num, base) {
                return num.toString(base); // 指定された進数に変換
            }

            // テスト用の数値
            const number = 255;

            // 2進数、8進数、16進数に変換
            const binary = convertToBase(number, 2); // 2進数
            const octal = convertToBase(number, 8);  // 8進数
            const hex = convertToBase(number, 16);   // 16進数

            // 結果をHTMLに表示
            document.getElementById('binaryValue').textContent = `${number} を2進数に変換: ${binary}`;
            document.getElementById('octalValue').textContent = `${number} を8進数に変換: ${octal}`;
            document.getElementById('hexValue').textContent = `${number} を16進数に変換: ${hex}`;
        }
    </script>
</head>
<body>

    <h1>n進数を変換する方法</h1>

    <div id="binaryValue"></div>
    <div id="octalValue"></div>
    <div id="hexValue"></div>

</body>
</html>

プログラムの解説

このプログラムでは、toString()メソッドを使用して数値をさまざまな進数に変換しています。このメソッドは、数値を指定された進数の文字列表現に変換します。

以下はtoString()メソッドの注意点です。

  • toString()メソッドは、10進数以外にも、2進数、8進数、16進数などのさまざまな基数で表現できます。
  • 基数(進数)は2から36までの整数を指定できます。2進数なら基数に2、16進数なら16を指定します。
  • 小数点以下を含む数値に対しては、進数に変換した結果も小数点以下の部分が維持されますが、進数ごとに表示形式が異なることがあります。

Numberオブジェクト メソッドの機能一覧

Number メソッドの機能一覧 | JavaScript リファレンス
JavaScriptのNumberオブジェクトは、数値操作に便利なメソッドを提供します。以下に、Numberオブジェクトのメソッドをインスタンスメソッドと静的メソッドに分け、アルファベット順でまとめています。 Numberオブジェクトのインスタンスメソッド メソッド名 説明と注意点 Number.prototype.t...