Web开发JS中Base62转约25位Hex及修复多余0问题

问题背景 #

我一直寻找实现Base62转Hex的方法，现有方案可行但Web开发中JS无法处理约25位的Base62字符量。原使用的脚本如下：

function base62ToHex(base62) {
  base62Charset = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
  const valueOfBase62Char = new Map([...base62Charset].map((char, i) => [char, i]))

  let decimal = 0;
  for (const [i, char] of [...base62].reverse().entries()) {
    decimal += 62**i * valueOfBase62Char.get(char)
  }

  return decimal.toString(16);
};
console.log(base62ToHex("3VOjfwjyAWOKEYNEQOZ8Tsm5RM"))

运行后输出：

>> 6578616d706c68000000000000000000000000

输出中存在多余的0，推测是输入过长导致，需修复该问题。

问题原因 #

JS的Number类型是双精度浮点数，最大安全整数仅为2^53 - 1（约9e15）。而25位Base62对应的数值范围远超这个上限，直接用Number运算会触发精度丢失，导致计算结果被截断，末尾补0。

修复方案 #

改用BigInt处理大整数运算，BigInt支持任意精度的整数计算，不会出现精度丢失问题。修改后的代码如下：

function base62ToHex(base62) {
  const base62Charset = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
  // 字符映射值转为BigInt类型
  const valueOfBase62Char = new Map([...base62Charset].map((char, i) => [char, BigInt(i)]));

  let decimal = 0n; // 初始化BigInt类型的结果变量
  for (const [i, char] of [...base62].reverse().entries()) {
    const charValue = valueOfBase62Char.get(char);
    // 用BigInt执行幂运算和乘法
    const power = 62n ** BigInt(i);
    decimal += charValue * power;
  }

  // BigInt的toString方法支持直接输出十六进制字符串
  return decimal.toString(16);
};
console.log(base62ToHex("3VOjfwjyAWOKEYNEQOZ8Tsm5RM"))

关键修改点 #

• 将字符映射表中的值转换为BigInt类型，确保运算时类型一致
• 初始化结果变量decimal为0n（BigInt的0值）
• 幂运算62**i改为62n ** BigInt(i)，用BigInt执行所有算术操作
• 最终通过BigInt的toString(16)方法生成正确的十六进制字符串

内容的提问来源于stack exchange，提问作者ActuatorHoliday346