计算器点击按钮报错TypeError：无法读取undefined的toString属性

问题根源 #

你的问题核心是this.currentOperand未初始化，默认值为undefined：

• 调用this.currentOperand.toString()时，undefined没有toString方法，直接抛出TypeError
• 直接拼接时，undefined会被转为字符串"undefined"，导致出现"undefined6"这类异常内容
• 原判断逻辑里this.currentOperand == undefined和this.currentOperand.includes('.')完全矛盾——如果currentOperand是undefined，前面的includes调用已经报错，这个条件根本不会生效。

修复步骤 #

1. 初始化currentOperand
   在计算器类的构造函数中，给this.currentOperand设置初始空字符串：

constructor() {
  this.currentOperand = '';
  // 其他初始化逻辑（比如绑定显示元素等）
}

2. 修正appendNumber方法逻辑
   移除矛盾的判断条件，只保留重复小数点的校验，同时简化拼接逻辑：

appendNumber(number){
  // 禁止重复输入小数点
  if (number === '.' && this.currentOperand.includes('.')) return
  // button.innerText本身就是字符串，直接拼接即可
  this.currentOperand += number
}

3. 确保updateDisplay逻辑正确
   确认updateDisplay方法能正确读取this.currentOperand并更新DOM，示例如下：

updateDisplay() {
  // 假设你已获取显示区域的DOM元素引用
  this.displayElement.innerText = this.currentOperand;
}

修改完成后，点击数字或小数点按钮就能正常在计算器栏显示内容，不会再出现undefined相关问题。

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