JavaScript switch语句已定义"none1"case却匹配失败问题咨询

问题根因 #

你在putTemperatureColorAt函数的switch判断逻辑中，先对入参temperature执行了Math.round()操作，这就是触发default分支的直接原因：

• 当入参为字符串"none1"时，Math.round("none1")的返回结果是NaN，而你定义的case "none1"分支是匹配原始字符串值，二者完全不相等，自然会走入default分支。
• 额外补充：JS中NaN和任何值做全等判断都会返回false，哪怕是NaN === NaN结果也为false，就算你新增case NaN分支也无法正确匹配特殊情况。

修复方案 #

建议优先调整判断逻辑，先处理无球的特殊标记，再对数值类型的温度做取整匹配，修改后的参考代码如下：

function putTemperatureColorAt(temperature, index)
{
    // 优先处理无球的特殊场景
    if(temperature === "none1") {
        ImgData.data[index + 0] = 0;
        ImgData.data[index + 1] = 0;
        ImgData.data[index + 2] = 0;
        ImgData.data[index + 3] = 255;
        return;
    }
    // 仅对数值类型的温度做取整处理
    const roundedTemperature = Math.round(temperature);
    switch(roundedTemperature)
    {
        case -5:
            ImgData.data[index + 0] = 0;
            ImgData.data[index + 1] = 255;
            ImgData.data[index + 2] = 255;
            ImgData.data[index + 3] = 255;
            break;
        case -4:
            ImgData.data[index + 0] = 50;
            ImgData.data[index + 1] = 255;
            ImgData.data[index + 2] = 200;
            ImgData.data[index + 3] = 255;
            break;
        case -3:
            ImgData.data[index + 0] = 100;
            ImgData.data[index + 1] = 255;
            ImgData.data[index + 2] = 150;
            ImgData.data[index + 3] = 255;
            break;
        case -2:
            ImgData.data[index + 0] = 150;
            ImgData.data[index + 1] = 255;
            ImgData.data[index + 2] = 100;
            ImgData.data[index + 3] = 255;
            break;
        case -1:
            ImgData.data[index + 0] = 200;
            ImgData.data[index + 1] = 255;
            ImgData.data[index + 2] = 50;
            ImgData.data[index + 3] = 255;
            break;
        case 0:
            ImgData.data[index + 0] = 255;
            ImgData.data[index + 1] = 255;
            ImgData.data[index + 2] = 0;
            ImgData.data[index + 3] = 255;
            break;
        case 1:
            ImgData.data[index + 0] = 255;
            ImgData.data[index + 1] = 200;
            ImgData.data[index + 2] = 0;
            ImgData.data[index + 3] = 255;
            break;
        case 2:
            ImgData.data[index + 0] = 255;
            ImgData.data[index + 1] = 150;
            ImgData.data[index + 2] = 0;
            ImgData.data[index + 3] = 255;
            break;
        case 3:
            ImgData.data[index + 0] = 255;
            ImgData.data[index + 1] = 100;
            ImgData.data[index + 2] = 0;
            ImgData.data[index + 3] = 255;
            break;
        case 4:
            ImgData.data[index + 0] = 255;
            ImgData.data[index + 1] = 50;
            ImgData.data[index + 2] = 0;
            ImgData.data[index + 3] = 255;
            break;
        case 5:
            ImgData.data[index + 0] = 255;
            ImgData.data[index + 1] = 0;
            ImgData.data[index + 2] = 0;
            ImgData.data[index + 3] = 255;
            break;
        default:
            console.log("Impossible to find color:" + temperature);
    }
}

修改后可以直接删除原有switch中的case "none1"分支，逻辑优先级更清晰，也避免了字符串传入数值处理方法的类型冲突问题。

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