如何在js计算器中去掉前导零

Question

所以我用javascript做了一个简单的计算器。我正在想办法去掉前面的零。我已经研究了如何做到这一点的各种方法，但零仍然出现。任何帮助都会很好。

const numberButton = document.querySelectorAll('.number'); //console.log(numbers)
const operatorButton = document.querySelectorAll('.operator');
const toolButton = document.querySelectorAll('.others');
const screenDisplay = document.querySelector('.screen_display')
let display;
numberButton.forEach(num => {
num.addEventListener("click", (e) => {
let strNum = e.target.value;
if (number === "0") {
display = screenDisplay.innerHTML = parseInt(strNum)
} else {
display = screenDisplay.innerHTML += parseInt(strNum)
}
if (display.length > 16) {
alert("stop")
}
})
})

Answer 1

方法1：使用正则表达式

number.replace(/^0+/, "")

方法2：使用parseInt函数

parseInt(number, 10)

方法3：使用一元算子

+number

Answer 2

您可以使用替换来修剪前导零

strNum = strNum.toString().replace(/^0+/, '');

Answer 3

尝试使用.toString((将Integer转换为String。然后可以使用.substring(1，(删除前导零；

希望这会有所帮助！

Answer 4

我建议将计算器state存储为数字，而不是字符串。这样，每次按下按钮都可以执行基本运算。按压0-不需要任何特殊条件

function onClick(event)
{ event.preventDefault()
switch (event.target.value)
{ case "1": case "2": case "3":
case "4": case "5": case "6":
case "7": case "8": case "9":
case "0":
state = (state * 10) + Number(event.target.value) // basic math
break
}
render()
}
function render()
{ calc.display.value = String(state)
}
const calc = 
document.forms.calc                   // calc DOM node
let state =
0                                     // initial state

calc.addEventListener("click", onClick) // single event listener

#calc {
display: flex;
width: 400px;
flex-wrap: wrap;
justify-content: space-between;
}
output {
width: 100%;
outline: 1px solid gray;
text-align: right;
padding: 0.25rem 0.5rem;
margin: 0 0 0.25rem;
}
button {
width: 33%;
text-align: center;
}

<form id="calc">
<output name="display">0</output>
<button value="1">1</button>
<button value="2">2</button>
<button value="3">3</button>
<button value="4">4</button>
<button value="5">5</button>
<button value="6">6</button>
<button value="7">7</button>
<button value="8">8</button>
<button value="9">9</button>
<button value="0">0</button>
</form>