其他

JavaScript中if条件里的逻辑运算符完全指南

悠悠楠杉

2025-06-22

0 评论

1 阅读

正在检测是否收录...

06/22

在JavaScript开发中，if条件语句就像程序的交通指挥灯，而逻辑运算符则是这个指挥系统中的核心控制元件。这些不起眼的符号组合，实际上决定着代码的执行路径和业务逻辑的走向。让我们以更"人性化"的方式，聊聊这些每天与我们打交道的逻辑伙伴。

逻辑与（&&）
这个符号就像严格的门卫："两个条件必须同时满足"。比如：
javascript if (isLogin && hasPermission) { // 就像说"既要是会员，又要有权限" }
有趣的是，&&会采用"短路求值"——当第一个条件为false时，根本不会检查第二个条件。这就像找对象要求"有房且有车"，如果连房都没有，谁还关心车呢？
逻辑或（||）
相对宽容的运算符，像会说"满足一个就行"的和事佬：
javascript if (isVIP || couponCode) { // "要么是VIP，要么有优惠券都行" }
它在实际项目中常用来设置默认值：
javascript const username = inputName || '匿名用户';
逻辑非（!）
这个感叹号是典型的"唱反调"专家：
javascript if (!isBanned) { // "只要没被封禁就行" }

当这些运算符组合使用时，就像在玩逻辑积木：

javascript if ((isStudent && age < 22) || (isTeacher && hasCertification)) { // "要么是22岁以下的学生，要么是有认证的老师" }

注意事项：
- 记得用括号明确优先级，就像数学中的先乘除后加减
- 多层嵌套时可以考虑拆分成变量，比如：
javascript const isEligible = (score > 80) && (attempts < 3); if (isEligible) {...}

运算符的"返回值"特性
这些运算符其实都会返回最后被评估的值：
javascript const result = 'John' && 42; // 返回42
** falsy值陷阱**
JavaScript特有的假值包括：false、0、""、null、undefined、NaN。在条件判断时：
javascript if (0 || null || undefined) { // 这些情况都不会执行 }
现代JS的可选链?.
虽然不是传统逻辑运算符，但常与if配合使用：
javascript if (user?.profile?.age > 18) {...}

防御性编程示例：
javascript function processData(data) { if (!data || !Array.isArray(data)) { throw new Error('无效数据'); } // 后续处理... }
权限校验模式：
javascript if (user.role === 'admin' || user.isSuperUser) { showAdminPanel(); }
表单验证组合：
javascript if ( (email.includes('@') || phone.length > 10) && password.length >= 8 ) { enableSubmitButton(); }

朗读

版权属于：

至尊技术网

本文链接：

https://www.zzwws.cn/archives/30503/（转载时请注明本文出处及文章链接）

作品采用：

至尊技术网