Vanilla JS计数器问题：添加边界判断后仍出现-1值的排查

问题根源 #

你写的减少按钮逻辑顺序出错了：当update为0时，你先把它重置为0，但之后不管条件如何都执行了update -= 1，所以0减1直接变成-1，这就是点击后出现负数的原因。

修复方案 #

把判断逻辑调整为「只有当前数值大于0时，才执行减少操作」，修改后的完整代码如下：

const add = document.getElementById('inc');
const less = document.getElementById('dec');
const zero = document.getElementById('res');

let count = document.getElementById('counter');
let update = 0;

add.addEventListener( 'click' , ()=> {
    update += 1;
    count.innerHTML = update;
});

// 修复后的减少按钮逻辑
less.addEventListener( 'click' , ()=> {
    // 仅当数值大于0时才允许减少
    if (update > 0) {
        update -= 1;
    }
    count.innerHTML = update;
});

zero.addEventListener( 'click' , ()=> {
    update = 0;
    count.innerHTML = update;
});

也可以用另一种写法（先减再修正，但不如上面高效）：

less.addEventListener( 'click' , ()=> {
    update -= 1;
    // 若减完后数值小于0，强制重置为0
    if (update < 0) {
        update = 0;
    }
    count.innerHTML = update;
});

两种写法都能保证计数器数值不会低于0，优先推荐第一种，因为它避免了不必要的数值变更操作。

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