在javascript中将十进制打印为二进制

Question

我遇到了一些代码问题，该函数旨在将十进制数从数组转换为二进制数。我正在使用parseInt 进行转换，但它只打印第一个数字，更经常打印NaN。我的目标是在 html 页面上打印所有与十进制数字等效的二进制数。

这是我的代码：

function decimal_table ()
  {
    // real_array stores decimal numbers.

    const real_array = [];
    const binary_array = [];

       for (let i = 0; i <= 50; i++)
      {
        real_array.push(i);
        document.getElementById("numbers").innerHTML = real_array.join(" ");
      }

       for (let b = 0; b <= 50; b++)
      {
        let calc = parseInt(real_array[b], 2);
        binary_array.push(calc);
        document.getElementById("binaries").innerHTML = binary_array.join(" ");
      }
  }

我希望输出如下所示：

0 0000
1 0001
2 0010
3 0011
4 0100

等等。

Answer 1

你可以看看

parseInt(real_array[b], 2);

您有一个数字，其中包含无法通过基数为 2 解析的数字。

以2 为例，执行parseInt(2, 2)。

结果是NaN，因为2不是二进制数，因为二进制数只有0和1的数字。

除此之外，方向不对，二进制→十进制，但是你需要十进制→二进制。

---

您需要使用以 2 为底的Number#toString 并用零填充开头。

您可以使用一个循环并将值添加到数组中。

在循环之后对元素进行赋值。

function decimal_table() {
    const real_array = [];
    const binary_array = [];

    for (let i = 0; i <= 50; i++) {
        real_array.push(i);
        binary_array.push(i.toString(2).padStart(8, 0));
    }

    document.getElementById("numbers").innerHTML = real_array.join(" ");
    document.getElementById("binaries").innerHTML = binary_array.join(" ");
}

decimal_table();

<div id="numbers"></div>
<div id="binaries"></div>

Answer 2

您可以对基数（基数）为 2 的整数值使用toString() 方法来获得二进制表示。

然后你只需填充值。

const pad = (n, padding) => (padding + n).substr(-padding.length)

for (let i = 0; i < 8; i++) {
  console.log(pad(i, '  '), pad(i.toString(2), '0000'));
}

.as-console-wrapper { top: 0; max-height: 100% !important; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/string-format/0.5.0/string-format.min.js"></script>

---

这是一个更高级和自记录的版本。

const isFunction = (fn) => fn && {}.toString.call(fn) === '[object Function]'
const pad = (n, padding) => (padding + n).substr(-padding.length)
const range = (min, max, step) => {
  if (max === undefined) { max = min; min = 0 }
  if (step === undefined) { step = 1 }
  return new Array(max - min).fill(0).map((_, i) => min + (isFunction(step) ? step(i) : (i * step)))
}

let start = 0
let end = 7
let base = 2
let binStep = n => Math.pow(base, n)                   // 2^n
let maxVal  = binStep(end)                             // 2^7 = 128
let maxLen  = Math.floor(Math.log10(maxVal)) + 1       // 3 (unused)
let decPad  = maxVal.toString(10).replace(/\d/g, ' ')  // '   '
let binPad  = maxVal.toString(2).replace('1', '0')     // '00000000'

range(start, end + 1, binStep)
  .forEach(n => console.log(pad(n, decPad), pad(n.toString(2), binPad)))

.as-console-wrapper { top: 0; max-height: 100% !important; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/string-format/0.5.0/string-format.min.js"></script>