我的JavaScript条件判断不生效，咖啡点单表单空选时输出错误如何解决？

• 你的判断逻辑位置错误：空选判断不能放在for循环内部，你现在的写法是每遍历一个配料就会给文本框赋值一次，哪怕前面有没勾选的配料设置了「纯咖啡」的文案，最后也会被循环末尾的You ordered coffee with + 空字符串覆盖，导致空选时文案不符合预期。
• 空选判断时机错误：要等所有配料遍历完成后，再根据选中的配料总和判断是要显示纯咖啡还是带配料的订单，不能在遍历过程中判断。
• 循环变量i没有声明，会成为全局变量污染作用域，也是隐性bug。

function coffeeOrder() {
    const itemLength = document.orderForm.items.length;
    let selectedItems = "";
    // 先遍历所有配料，收集所有选中的项
    for (let i = 0; i < itemLength; i++) {
        if (document.orderForm.items[i].checked) {
            selectedItems += document.orderForm.items[i].value + " ";
        }
    }
    const orderEle = document.getElementById("showOrder");
    // 遍历完成后统一判断展示内容
    if (selectedItems.trim() === "") {
        orderEle.value = "你点了纯咖啡";
    } else {
        orderEle.value = "你点了加" + selectedItems.trim() + "的咖啡";
    }
}

• 可以用数组存储选中的配料，最后用join('、')方法拼接，避免手动拼接带来的末尾多余空格问题，也能让配料之间的分隔符更规范
• 可以把固定文案提取成变量，后续修改文案时不需要调整逻辑代码
• 可以增加表单元素存在性校验，避免页面元素修改后出现控制台报错

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