实现一个简易计算器 | 刷题打卡

吐槽君 分类:javascript

本文正在参与掘金团队号上线活动,点击 查看大厂春招职位

一、题目描述:

华为计算器.png

这道题目是华为机试题,主要实现两个功能:

    1. 绑定按钮点击事件。
    1. 完成calculate函数的编写,实现加减乘除的功能。

二、思路分析:

这道题目需要实现两个功能:

  1. 绑定按钮点击事件。

    分析: 主要考察的是事件委托

  2. 完成calculate函数的编写,实现加减乘除的功能。

    分析: 题解中要求实现大于 9007199254740992 的加法,也就是大数加法。而且需要考虑整数和浮点数两种场景。大数加法,首先要考虑把数据存储到数组中。

三、完整代码:

事件委托:

完整代码较长,事件委托的主要原理是利用dom的冒泡特性,在根元素上绑定对cclick事件的监听,在回调事件中,根据ev.target得到触发点击事件的真正元素,分析元素上的属性进行针对性的处理。

document.addEventListener('click', function (ev) {
      var ev = ev || window.event
      var target = ev.target 
      if (target.id === 'calculate') {
      	// =号按钮
      } else if (target.className === 'col') {
        // 数字按钮
      } else if (target.className === 'col operator') {
        // 运算符按钮
      }
})
 

大数加法:

calculate函数的实现:

目前实现了大数加法。要考虑整数部分加法和小数部分加法。小数部分的加法先将数据翻转,完成加法计算后再将结果翻转回去即可。

function add(aArr, bArr, isDecimal = false) {
      let result = '', resultArr = [], i = aArr.length - 1, j = bArr.length - 1
      while (i >= 0 && j >= 0) {
        resultArr.unshift((aArr[i] - '') + (bArr[j] - ''))
        i--
        j--
      }
      if (i >= 0) {
        resultArr = aArr.splice(0, i + 1).concat(resultArr)
      }
      if (j >= 0) {
        resultArr = bArr.splice(0, j + 1).concat(resultArr)
      }
      let index = resultArr.length - 1, upper = 0
      while (index >= 0) {
        resultArr[index] = resultArr[index] - '' + upper
        if (resultArr[index] > 10) {
          upper = parseInt(resultArr[index] / 10)
          resultArr[index] = resultArr[index] % 10
        } else {
          upper = 0
        }
        index--
      }
      if (upper) { resultArr.unshift(upper) }
      if (isDecimal) resultArr.reverse()
      result = resultArr.join('')
      return result
    }
    function handleData(str) {
      let result = []
      if (str.indexOf('.') !== -1) {
        result = str.split('.')
      } else {
        result = [str]
      }
      return result.map((item, index) => {
        if (index == 1) {
          return item.split('').reverse()
        } else {
          return item.split('')
        }
      })
    }
    function calculate(numberA, numberB, operator) {
      let aArr = handleData(numberA)
      let bArr = handleData(numberB)
      if (operator == '+') {
        if (aArr.length == 2 && bArr.length == 2) {
          return add(aArr[0], bArr[0]) + '.' + add(aArr[1], bArr[1], true)
        } else if (aArr.length == 2) {
          return add(aArr[0], bArr[0]) + '.' + aArr[1].reverse().join('')
        } else if (bArr.length == 2) {
          return add(aArr[0], bArr[0]) + '.' + bArr[1].reverse().join('')
        } else {
          return add(aArr[0], bArr[0])
        }

      } else if (operator == '-') {

      } else if (operator == 'x') {

      } else if (operator == '/') {

      }
    }
 

完整代码:简易计算器

线上代码:计算器在线地址

四、总结:

这道题目的难点在于实现大数加法,需要考虑整数和浮点数两种场景。涉及到大数的问题要想到将数据转化成数组来处理。

回复

我来回复
  • 暂无回复内容