Web前端入门第 59 问：JavaScript 条件语句中善用 return 让代码更清晰
条件语句JS 的条件语句不太多，就 if 和 switch 两个，不过他们的使用方式也可以算是眼花缭乱了。
if 语句
if 字面意思：如果 xxx。程序中的用法也是这样，如果条件为真，则执行执行代码块，反之则不执行。
语法：
if (条件) {
// 条件为真时执行
} else if (其他条件) {
// 前一个条件为假且当前条件为真时执行
} else if (其他条件) {
// 前面所有条件为假且当前条件为真时执行
} else {
// 所有条件均为假时执行
}基础用法：
if (true) {
console.log('条件为真执行代码块');
}
// 如果代码块中只有一个语句，可以省略花括号
if (true) console.log('条件为真执行代码块');if & else 用法：
const age = 20;
if (age < 18) {
console.log('未成年');
} else {
console.log('成年人');
}
// 也可省略花括号
if (age < 18) console.log('未成年');
else console.log('成年人');完整示例：
const age = 20;
if (age < 18) {
console.log('未成年');
} else if (age >= 18 && age < 50) {
console.log('成年人');
} else if (age >= 50 && age < 65) {
console.log('中年人');
} else {
console.log('老年人');
}虽然 if 条件语句的语法上支持省略花括号，但在实际编码中，还是不太建议这么做，代码可读性降低，导致维护成本增加。
switch 语句
switch 语句和 if 语句很像，都用于条件判断，但 switch 语句中不支持条件表达式，case 后面只能是一个值或者运算表达式。
使用时特别注意 break 关键字，如果少了这个，您的代码会出大篓子。
使用 switch 语句：
const fruit = 'apple';
switch (fruit) {
case 'apple':
console.log('苹果');
break;
case 'banana':
console.log('香蕉');
break;
case 'orange':
console.log('橘子');
break;
default:
console.log('其他水果');
break;
}以下代码错误写法，将始终都是 default 分支：
const age = 20;
switch (age) {
case age < 18:
console.log('未成年');
break;
case age >= 18 && age < 50:
console.log('成年人');
break;
case age >= 50 && age < 65:
console.log('中年人');
break;
default:
console.log('老年人');
}但可以这样用：
const fruit = 'apple';
const apple = 'apple';
switch (fruit) {
case apple: // 可以使用变量
console.log('苹果');
if (true) { // case 中可以使用条件语句
console.log('进入条件语句');
}
break;
case 'ban' + 'ana': // 可以使用运算符
console.log('香蕉');
break;
default:
console.log('其他水果');
break;
}使用 switch 语句时，如果少了 break 关键字，就触发了神奇的 case 穿透 问题。看例子：
const fruit = 'apple';
switch (fruit) {
case 'apple':
console.log('苹果');
// 没有 break，代码会走到下一个 case
case 'banana':
console.log('香蕉');
// 依然没有 break，继续往下走
case 'orange':
console.log('橘子');
// 仍然没有 break，继续
default:
console.log('其他水果');
// switch 结束了
}以上代码会同时输出：
苹果
香蕉
橘子
其他水果if 优化
代码中免不了会出现很多 if 判断情况，如果代码组织能力太差，那就像捅了 if 窝一样~~
看一个在曾经项目中前辈写的代码：
if (score.length != 0) {
if (score >= 0 && score <= 10) {
if (res1.status === '1') {
if (res2.status === '1') {}
if (viewShow) {
} else {}
} else {}
} else {}
} else {}卫语句优化后：
function checkOrder(order) {
if (order.isValid) {
if (order.items.length > 0) {
if (order.total > 0) {
// 核心逻辑
return '1';
} else {
return '2';
}
} else {
return '3';
}
} else {
return '4';
}
}优化后：
function isProductAvailable(product) { // 判断产品是否有库存if (product.stock
页:
[1]