JS中if语句OR逻辑异常:掷骰子功能条件判断失效问题
问题分析与解决:逻辑运算符误用导致的条件判断失效
你遇到的核心问题是对**逻辑或(||)**的真值逻辑理解有偏差,咱们一步步拆解清楚:
逻辑OR的核心规则
逻辑||运算符的判断逻辑是:只要任意一个条件为true,整个表达式就为true;只有当两个条件全为false时,结果才是false。这和你可能误以为的“有假即假”完全相反。
你的代码逻辑分析
先看你原代码里的条件:
if(dice !== 1 || lastRoll !== 6) { ... }
这个条件只有在当前掷出的是1,并且上一次掷出的是6的时候才会为false,进入else分支;其他所有情况(比如当前不是1,不管上一次是什么;或者上一次不是6,不管当前是什么)都会进入if分支——这显然和你的预期不符。
再看你的测试代码:
var hardCoded = 6; if(dice !== 1 || hardCoded !== 6) { ... }
这里hardCoded !== 6固定为false,但只要dice不是1,dice !==1就是true,整个条件就会成立,所以if语句会执行。你预期“这个条件始终不成立”,是因为混淆了||和&&的逻辑。
修正方案:用逻辑与(&&)替代逻辑或(||)
从你的测试预期和代码行为来看,你真正想要的应该是:只有当掷出的数字不是1,并且上一次掷出的数字不是6时,才执行操作。这时候需要用逻辑与(&&)——它的规则是两个条件必须同时为true,整个表达式才为true。
修改后的完整代码如下:
var lastRoll = 0; document.querySelector('.btn-roll').addEventListener('click', function() { var dice = Math.floor(Math.random() * 6) + 1; console.log('current ' + dice + ' last ' + lastRoll); // 改用逻辑与,符合“两个条件同时满足才执行”的需求 if(dice !== 1 && lastRoll !== 6) { lastRoll = dice; console.log('success'); } else { lastRoll = 0; console.log('fail'); } });
现在再测试你之前的用例:如果把lastRoll换成固定的6,条件dice !==1 && 6 !==6会变成dice !==1 && false,结果固定为false,if语句不会执行,完全符合你的预期。
内容的提问来源于stack exchange,提问作者MeltingDog




