Javascript数值比较异常：64>360判断返回true如何排查

这是JavaScript开发中非常典型的隐式类型对比错误，你遇到的64 > 360返回true的核心原因是：参与对比的this.x和maxX至少有一个是字符串类型，而非数字类型。

JavaScript中字符串的大小对比规则是逐位比对字符的Unicode编码值：比对'64'和'360'时，第一位字符'6'的编码值远大于'3'，所以会直接返回true，不会继续比对后续位数，也就出现了反直觉的结果。

这类问题的常见触发场景包括：坐标值从DOM的style属性读取（带px等单位后缀）、接口返回的坐标字段未做类型转换、从输入框取值后直接使用未转数字等。

• 先确认变量类型：在判断逻辑前新增一行打印console.log(typeof this.x, typeof maxX)，验证是否存在字符串类型的值
• 临时快速修复：将判断条件修改为统一转数字后再对比，代码如下：

  if (Number(this.x) > Number(maxX)) {
    // 原有更新逻辑
  }
  

• 根治疗法：溯源this.x的赋值逻辑，在赋值时就直接转为数字类型，避免后续所有涉及坐标计算的逻辑都踩类型坑
• 异常兜底：如果业务中存在坐标为空、非数字格式的场景，可以补充非空校验避免出现NaN异常：

  const numX = Number(this.x)
  const numMaxX = Number(maxX)
  if (!isNaN(numX) && !isNaN(numMaxX) && numX > numMaxX) {
    maxX = numX
  }
  

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