正文

学会JS轻松玩转switch开关，告别if-else烦恼，代码更简洁！

/0 浏览量
0330

JavaScript 是一种灵活且强大的编程语言，其控制语句的功能是构建逻辑和交互式功能的核心。在 JavaScript 中，switch 语句是一个非常有用的工具，它可以让我们以更简洁的方式处理多个条件分支，相比于繁琐的 if-else 结构。

什么是switch语句？

switch 语句允许我们根据表达式的值与多个可能的值进行比较，然后执行匹配的代码块。这与 if-else 结构中一个条件匹配多个情况不同，switch 更适合处理离散的值，如变量中的某个值。

switch语句的基本语法

switch (表达式) {
  case 值1:
    // 当表达式的值等于值1时执行的代码块
    break;
  case 值2:
    // 当表达式的值等于值2时执行的代码块
    break;
  /* ... */
  default:
    // 表达式的值不匹配任何case时执行的代码块
    break;
}
  • switch 后面跟随的是我们需要检查的表达式。
  • case 关键字后跟一个可能的匹配值。
  • break 语句用于终止当前 switch 语句的执行，如果没有 break，则流程会继续执行下一个 case 语句。

优势：简洁明了，易于阅读

相比于 if-else，switch 语句在处理多个离散值时，可以使代码更简洁，更易于阅读和维护。下面是一个使用 switch 的例子：

使用if-else

if (score === 10) {
  console.log('完美！');
} else if (score === 9) {
  console.log('非常好！');
} else if (score === 8) {
  console.log('良好！');
} else {
  console.log('加油！');
}

使用switch

switch (score) {
  case 10:
    console.log('完美！');
    break;
  case 9:
    console.log('非常好！');
    break;
  case 8:
    console.log('良好！');
    break;
  default:
    console.log('加油！');
    break;
}

在这个例子中，switch 使代码更简洁、更直观。

switch的高级用法

虽然 switch 在处理离散值时很有用，但也可以用一些高级技巧来扩展其功能：

范围匹配

switch 可以用于范围匹配，使用 break 语句来控制流程。

switch (score) {
  case 10:
  case 9:
    console.log('优秀！');
    break;
  case 8:
    console.log('良好！');
    break;
  default:
    console.log('加油！');
    break;
}

不使用break

如果我们不使用 break 语句，流程将会“穿透”当前的 case 块，并继续执行下一个 case 块。这可能会导致意外的结果。

switch (score) {
  case 10:
    console.log('完美！');
  case 9:
    console.log('非常好！');
    break; // 加上这个break语句，就可以防止穿透
  case 8:
    console.log('良好！');
    break;
  default:
    console.log('加油！');
    break;
}

总结

switch 语句是 JavaScript 中一个强大的工具，它可以使我们的代码更加简洁、易读和维护。学会使用 switch，我们可以告别 if-else 的繁琐，更轻松地处理条件逻辑。希望这篇文章能帮助你更好地理解和使用 switch 语句！

-- 展开阅读全文 --