最近在做一个手机数字键盘，需要用到浮点数的加减运算，但是原生JavaScript的浮点数加减法会出现0.1 + 0.2 = 0.30000000000000004这种意外情况，但我想要的是0.1+0.2=0.3这种结果，在网上找了一遍没有发现好用的库，就自己动手实现一个浮点数的加减法的函数

原理分析

由于浮点数计算存在bug，为了能够得到结果运算结果：

把浮点数转换成整数，记录两个数中小数位数值中的最大值，对于小数位数比较少的在数字后面补0

  100.234 + 0.0005 // 记录小数位最大值是4
  100.234 ==> '100' + '2340' // '234'后面需要补一个0
  0.0005 ==> '00005'

使用parseInt转换成整数进行运算

  parseInt('100234') // 1002340
  parseInt('00005') // 5
  parseInt('100234') + parseInt('00005') => 1002345

得到结果后把结果转换成字符串，然后把小数点插进去

  '' + 1002345 => '1002345'
  // 根据记录的小数点的位置
  '1002345'.slice(-4) + '.' + '1002345'.slice(0, 4) => '100.2345'

代码实现

function add(x, y) { // x, y都是正数或者负数
  x = typeof x === 'string' ? x : '' + x
  y = typeof y === 'string' ? y : '' + y
  let [intX, floatX] = x.split('.')
  let [intY, floatY] = y.split('.')
  let floatLengthMax = 0
  let result = ''
  // 获取x, y中最大的小数个数
  if(floatX && floatY) {
    floatLengthMax = Math.max(floatX.length, floatY.length)
  } else if(floatX === undefined && floatY !== undefined) {
    floatLengthMax = floatY.length
  } else if(floatX !== undefined && floatY === undefined) {
    floatLengthMax = floatX.length
  } else {
    floatLengthMax = 0
  }
  // 根据x, y是否为小数做不同的处理
  if(floatX === undefined && floatY === undefined) { // x, y是整数
    return parseInt(intX) + parseInt(intY) + ''
  } else if(floatX !== undefined && floatY === undefined) { // x是小数, y是整数
    result =  parseInt(intX + floatX) + parseInt(intY + floatX.replace(/\d/g, '0')) + ''
  } else if(floatX === undefined && floatY !== undefined) { // x是整数, y是小数
    result =  parseInt(intX + floatY.replace(/\d/g, '0')) + parseInt(intY + floatY) + ''
  } else if(floatX !== undefined && floatY !== undefined) { // x, y都是小数
    let stringX = ''
    let stringY = ''
    if(floatX.length === floatLengthMax){
      stringX = intX + floatX
      stringY = intY + floatY + floatX.slice(floatY.length).replace(/\d/g, '0')
    } else {
      stringX = intX + floatX + floatY.slice(floatX.length).replace(/\d/g, '0')
      stringY = intY + floatY
    }
    result = parseInt(stringX) + parseInt(stringY) + ''
  }
  // 判断结果需不需要补0
  // 例如0.0003 + 0.00002 => .32
  if(result.length <= floatLengthMax) {
    let zeroStr = ''
    for(let i = 0; i < floatLengthMax - result.length; i++) {
      zeroStr += '0'
    }
    return '0.' + zeroStr + result
  } else {
    return result.slice(0, -floatLengthMax) + '.' + result.slice(-floatLengthMax)      
  }
}

function sub(x, y) { // x, y有一个是负数
  x = typeof x === 'string' ? x : '' + x
  y = typeof y === 'string' ? y : '' + y
  let [intX, floatX] = x.split('.')
  let [intY, floatY] = y.split('.')
  let result = ''
  // 获取x, y中最大的小数个数
  if(floatX && floatY) {
    floatLengthMax = Math.max(floatX.length, floatY.length)
  } else if(floatX === undefined && floatY !== undefined) {
    floatLengthMax = floatY.length
  } else if(floatX !== undefined && floatY === undefined) {
    floatLengthMax = floatX.length
  } else {
    floatLengthMax = 0
  }
  // 根据x, y是否为小数做不同的处理
  if(floatX === undefined && floatY === undefined) { // x, y是整数
    return parseInt(intX) + parseInt(intY) + ''
  } else if(floatX !== undefined && floatY === undefined) { // x是小数, y是整数
    result = parseInt(intX + floatX) + parseInt(intY + floatX.replace(/\d/g, '0')) + ''
  } else if(floatX === undefined && floatY !== undefined) { // x是整数, y是小数
    result =  parseInt(intX + floatY.replace(/\d/g, '0')) + parseInt(intY + floatY) + ''
  } else if(floatX !== undefined && floatY !== undefined) { // x, y 都是小数
    let stringX = ''
    let stringY = ''
    if(floatX.length === floatLengthMax){
      stringX = intX + floatX
      stringY = intY + floatY + floatX.slice(floatY.length).replace(/\d/g, '0')
    } else {
      stringX = intX + floatX + floatY.slice(floatX.length).replace(/\d/g, '0')
      stringY = intY + floatY
    }
    result = parseInt(stringX) + parseInt(stringY) + ''
  }

  // 判断结果需不需要补0
  // 例如0.0003 - 0.00002 => .-28
  let minus = result.indexOf('-') > -1 ? '-' : ''
  result = result.indexOf('-') > -1 ? result.slice(1) : result
  if(result.length <= floatLengthMax) {
    let zeroStr = ''
    for(let i = 0; i < floatLengthMax - result.length; i++) {
      zeroStr += '0'
    }
    return minus + '0.' + zeroStr + result
  } else {
    return minus + result.slice(0, -floatLengthMax) + '.' + result.slice(-floatLengthMax)
  }
}

function calcFloat(x, y) {
  let valueX = typeof x === 'string' ? parseFloat(x) : x
  let valueY = typeof y === 'string' ? parseFloat(y) : y
  if(x >= 0 && y >= 0) {
    return add(x, y)
  } else if(x < 0 && y >= 0){
    return sub(y, x)
  } else if(x >= 0 && y < 0) {
    return sub(x, y)
  } else {
    return add(x, y)
  }
}

用JavaScript实现浮点数的加减法

原理分析

代码实现