如何在 TypeScript 中使用 switch 语句覆盖多个 if-else 条件?
在本教程中，我们将学习如何在 TypeScript 中使用 switch case 语句覆盖多个 if-else 条件。单个 if-else 语句用于执行条件语句。如果条件成立，则执行 if 块中的语句，否则控制权回退到 else 块并执行其语句。
在某些情况下，开发人员必须在不同的条件下执行代码块。为此，他们需要编写多个 if-else 语句，或编写多个 if-else 语句的阶梯式结构。在这里，我们将 if-else 语句的阶梯式转换为 switch case 语句。
在 TypeScript 中将 If-else 条件转换为 Switch 语句
在这里，我们获取了边数组，并使用 if-else 阶梯式根据人物的年龄显示不同的单词。
// 年龄数组
let ages: Array<number> = [32, 5, 12, 34, 54, 65, 76];
// 不同范围边的 if-else 阶梯式
for (let age of ages) {
if (age <= 10) {
// 打印 childern
} else if (age > 10 && age <= 20) {
// 打印 younger
} else if (age > 20 && age <= 60) {
// 打印 mature man
} else {
// 打印 old man
}
}
现在，我们将上面的 if-else 阶梯语句转换为 switch case 语句。switch case 语句将值作为参数，并为其创建了不同的 case。这里，我们使用不同 case 的条件，返回布尔值。因此，我们将布尔值"true"作为 switch case 的参数传递。
// 年龄数组 let ages: Array= [32, 5, 12, 34, 54, 65, 76]; // 针对不同范围的边使用 switch case 语句 for (let age of ages) { switch (true) { case age <= 10: // 打印 children break; case age > 10 && age <= 20: // 打印年轻人 break; case age > 20 && age <= 60: // 打印成熟男性 break; default: // 打印老年人 } }
在上面的语法中，我们使用 switch case 语句来区分年龄的不同情况。
示例 1
在下面的示例中，我们创建了一个包含从 0 到 80 的不同数字的年龄数组。之后，我们使用 for 循环遍历数组元素，并针对每个元素执行 switch case 语句。
此外，用户可以看到我们使用了 break 关键字来中断语句和默认情况，这相当于 if-else 阶梯中的最后一个 else 块。在输出中，用户可以观察到它根据年龄的值打印不同的单词。
let ages: Array<number> = [32, 5, 12, 34, 54, 65, 76];
for (let age of ages) {
switch (true) {
case age <= 10:
console.log(age + " = child");
break;
case age > 10 && age <= 20:
console.log(age + " = younger");
break;
case age > 20 && age <= 60:
console.log(age + " = mature man");
break;
default:
console.log(age + " = old man");
}
}
编译后，它将生成以下 JavaScript 代码 -
var ages = [32, 5, 12, 34, 54, 65, 76];
for (var _i = 0, ages_1 = ages; _i < ages_1.length; _i++) {
var age = ages_1[_i];
switch (true) {
case age <= 10:
console.log(age + " = child");
break;
case age > 10 && age <= 20:
console.log(age + " = younger");
break;
case age > 20 && age <= 60:
console.log(age + " = mature man");
break;
default:
console.log(age + " = old man");
}
}
输出
上述代码将产生以下输出 -
32 = mature man 5 = child 12 = younger 34 = mature man 54 = mature man 65 = old man 76 = old man
示例 2
在下面的示例中，我们创建了名为 Websites 的枚举，其中包含不同的网站。之后，我们创建了名为 web 的变量，该变量包含枚举中"TutorialsPoint"网站的值。
getWebsites() 函数根据 web 变量的值，使用 switch case 语句打印值。基本上，用户可以从下面的示例中学习如何在 switch case 语句中使用枚举值。
// 为不同的网站创建枚举
enum Websites {
TutorialsPoint,
Tutorix,
}
// 创建包含值 TutorialsPoint 的 web 变量
var web: Websites = Websites.TutorialsPoint;
// 包含 switch case 语句的函数
function getWebsites() {
// web 变量的 switch case 语句
switch (web) {
case Websites.TutorialsPoint:
console.log("You are on TutorialsPoint Website.");
break;
case Websites.Tutorix:
console.log("You are on Tutorix Website.");
break;
}
}
getWebsites(); // get websites
编译后，它将生成以下 JavaScript 代码 -
// 为不同的网站创建枚举
var Websites;
(function (Websites) {
Websites[Websites["TutorialsPoint"] = 0] = "TutorialsPoint";
Websites[Websites["Tutorix"] = 1] = "Tutorix";
})(Websites || (Websites = {}));
// 创建包含值 TutorialsPoint 的 web 变量
var web = Websites.TutorialsPoint;
// 包含 switch case 语句的函数
function getWebsites() {
// 为 web 变量设置 switch case 语句
switch (web) {
case Websites.TutorialsPoint:
console.log("You are on TutorialsPoint Website.");
break;
case Websites.Tutorix:
console.log("You are on Tutorix Website.");
break;
}
}
getWebsites(); // get websites
输出
上述代码将产生以下输出 -
You are on TutorialsPoint Website.
在本 TypeScript 教程中，用户学习了如何将 if-else 阶梯式语句转换为 switch case 语句。在第一个示例中，用户学习了如何使用条件语句来处理 switch 语句的 case。在第二个示例中，用户学习了如何使用枚举值来处理 switch 语句的 case。
此外，用户还学习了如何在 TypeScript 中将 break 和 default 关键字与 switch case 语句结合使用。
