实现一个简易计算器 | 刷题打卡
分类:javascript
本文正在参与掘金团队号上线活动,点击 查看大厂春招职位
一、题目描述:
这道题目是华为机试题,主要实现两个功能:
-
- 绑定按钮点击事件。
-
- 完成
calculate
函数的编写,实现加减乘除的功能。
- 完成
二、思路分析:
这道题目需要实现两个功能:
-
绑定按钮点击事件。
分析: 主要考察的是事件委托
-
完成
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 == '/') {
}
}
完整代码:简易计算器
线上代码:计算器在线地址
四、总结:
这道题目的难点在于实现大数加法,需要考虑整数和浮点数两种场景。涉及到大数的问题要想到将数据转化成数组来处理。