美文网首页
10-JavaScript基础-流程控制-Switch

10-JavaScript基础-流程控制-Switch

作者: 雪妮爸爸 | 来源:发表于2018-10-17 22:13 被阅读0次

Switch基本概念

  • Switch和if一样都属于选择结构, 都会对给定的条件进行判断,再根据判断结果来决定执行哪一段代码。
Switch基本格式
switch(条件表达式){
  case 表达式:
      语句1;
      break;
  case 表达式:
      语句2; 
      break;
  case 表达式n:
      语句n;
      break;
  default:
      语句n+1;
      break;
}
  • 其语义是:

计算条件表达式的值。 并逐个与case后面表达式的结果值比较
当条件表达式的值与某个表达式的值全等时, 执行其后的语句,并且不会再与其它case进行比较
如条件表达式的值与所有case后的表达式均不相同时,则执行default后的语句。
示例

var num = 2;
switch(num){
    case 1:
        console.log("壹");
        break;
    case 2:
        console.log("贰"); // 输出贰
        break;
    case 3:
        console.log("叁");
        break;
    default:
        console.log("非法数字");
        break;
}

Switch注意事项

  • case全等于问题

    JavaScript中case判断是否相等时是全等于(===),而不是等于(==),也就是说既会判断类型是否相等又会判断值是否相等

var str = "123";
switch (str){
    case 123:
        console.log("123数字");
        break;
    case "123":
        console.log("123字符串"); // 输出123字符串
        break;
    default:
        console.log("default");
        break;
}
  • case后可以是常量也可以是变量

var num = 120;
switch (120){
    case num: // 这里可以是变量
        console.log("120"); // 输出120
        break;
    case 110: // 这里可以是常量
        console.log("110");
        break;
    default:
        console.log("default");
        break;
}
  • 表达式判断问题

判断时会先计算表达式的值,再判断

switch (120 + 3){ // 计算后为123
    case 120:
        console.log("120");
        break;
    case 3:
        console.log("3");
        break;
    case 3 + 120: // 计算后为123
        console.log("3 + 120"); // 输出3 + 120
        break;
    default:
        console.log("default");
        break;
}
  • case的穿透问题

    • switch里面的case只要匹配一次其它的都会失效,包括default.
    • 在case语句最后增加 break 语句,使每一次执行之后均可跳出switch语句,从而避免输出不·应有的结果
var num = 2;
switch(num){
    case 1:
        console.log("壹");
    case 2:
        console.log("贰"); // 输出贰
    case 3:
        console.log("叁");// 输出叁
    default:
        console.log("非法数字");  // 输出非法数字
}
  • default的位置问题

default可以省略
default语句可以写在switch语句中的任意位置

if语句和switch语句转换

 要求用户输入一个分数,根据输入的分数输出对应的等级
   A 90~100
   B 80~89
   C 70~79
   D 60~69
   E 0~59
  • 利用if实现
    //    1.定义变量保存用户输入的分数
    var score;
    //    2.提接收用户输入的学生的分数
    score = +(window.prompt("请输入一个0~100的分数\n"));
    //    3.判断用户输入的分数输出对应的等级
    if (score >= 90 && score <= 100) {
        alert("A");
    }else if (score >= 80 && score <= 89) {
        alert("B");
    }else if (score >= 70 && score <= 79) {
        alert("C");
    }else if (score >= 60 && score <= 69) {
        alert("D");
    }else if (score >= 0 && score <= 59) {
        alert("E");
    }else{
        alert("少喝点三鹿");
    }
  • 利用switch实现
    //    1.定义变量保存用户输入的分数
    var score;
    //    2.提接收用户输入的学生的分数
    score = +(window.prompt("请输入一个0~100的分数\n"));
    //    3.判断用户输入的分数输出对应的等级
    // 100/10 = 10, 99/10 = 9.9
    console.log(score / 10);
    console.log(parseInt(score / 10));
    switch (score/10) {
        case 10: // 利用case的穿透简化代码
        case 9:
            alert("A");
            break;
        case 8:
            alert("B");
            break;
        case 7:
            alert("D");
            break;
        case 6:
            alert("C");
            break;
        default:
            alert("E");
            break;
    }

if语句和switch语句选择

  • 分支比较多且无法穷尽时最好用 if, 其它情况可以按照个人习惯
  • 如果数据量不是很大, 并且数据是固定的可以用Switch
  • 理论上Switch的效率比if高
  • 示例Switch弊端

判断用户输入的数是否大于100
if实现

//    1.定义变量保存用户输入的分数
var score;
//    2.提接收用户输入的学生的分数
score = +(window.prompt("请输入一个0~100的分数\n"));
//    3.判断用户输入的数是否大于100
if (a > 100) {
    console.log("大于");;
}

switch实现

// 挺(T)萌(M)的(D)搞不定啊
switch (101) {
    case 101:
    case 102:
    case 103:
    case 104:
    case 105:
        console.log("大于\n");
        break;
    default:
        console.log("小于\n");
        break;
}

Switch练习
从键盘输入一个月份,输出对应季节 12~2 冬季 3~5 春季 6~ 8 夏季 9~11 秋季(用switch)

    //    1.定义变量保存用户输入的数据
    var month;
    //    2.利用window.prompt()接收用户输入数据
    month = +(window.prompt("请输入一个1-12的月份"));
    //    3.数据安全校验
    if(isNaN(month)){
        alert("火星SB?");
    }else{
//    4.根据输入的数据判断输出对应的月份即可
        switch (month){
            case 1:
            case 2:
            case 12:
                alert("冬季");
                break;
            case 3:
            case 4:
            case 5:
                alert("春季");
                break;
            case 6:
            case 7:
            case 8:
                alert("夏季");
                break;
            case 9:
            case 10:
            case 11:
                alert("秋季");
                break;
            default:
                alert("你是SB么?");
                break;
        }
    }

使用Switch实现简单的计算器

// 1.定义变量保存用户输入
var num1,num2,op,result;
// 2.接收用户输入
num1 = +(window.prompt("请输入第一个数字"));
op = window.prompt("请输入运算符: + - * /");
num2 = +(window.prompt("请输入第二个数字:"));
// 3.根据用户输入计算结果
switch (op) {
    case "+":
        result = num1+num2;
        break;
    case "-":
        result = num1-num2;
        break;
    case "*":
        result = num1*num2;
        break;
    case "/":
        result = num1/num2;
        break;
    default:
        alert("更多功能请使用付费版本");
        break;
}
// 4.输出结果
alert("计算结果:" + result);

相关文章

  • 10-JavaScript基础-流程控制-Switch

    Switch基本概念 Switch和if一样都属于选择结构, 都会对给定的条件进行判断,再根据判断结果来决定执行哪...

  • 10-JavaScript基础-流程控制-Switch

    Switch基本概念 Switch和if一样都属于选择结构, 都会对给定的条件进行判断,再根据判断结果来决定执行哪...

  • 2018-11-29

    17js流程控制switch 17js流程控制switch //js流程控制swi...

  • JavaScript-流程控制语句

    一、if流程控制语句 二、switch流程控制语句 三、流程控制语句

  • Go基础笔记

    Go语言基础(一) 流程控制语句:for、if、else、switch、defer for Go只有一种循环结构:...

  • JAVA switch语句

    流程控制语句switch switch语句解构(重要) A:switch语句解构 a:switch只能针对某个表达...

  • JavaScript基础--流程控制-Switch

    Switch基本概念 Switch和if一样都属于选择结构, 都会对给定的条件进行判断,再根据判断结果来决定执行哪...

  • 30分钟搞定GO语言(二)

    基础 一开始,将学习关于语言的所有基础内容: 第二节中涉及流程控制语句:for、if、else 、switch 和...

  • .NET 平台从入门到上台(6)

    流程控制 if else switch while do while for (;;) foreach

  • php常用语法

    php常用语法 1、流程控制和循环 1.1、流程控制 if...else switch...case $ag...

网友评论

      本文标题:10-JavaScript基础-流程控制-Switch

      本文链接:https://www.haomeiwen.com/subject/xgjdzftx.html