当前位置:首页 > 科技  > 软件

一篇文章带你了解JavaScript switch

来源: 责编: 时间:2024-04-19 17:25:39 241观看
导读Switch是与if ... else ...相同的条件语句,不同之处在于switch语句允许根据值列表测试变量是否相等。switch 语句用于根据不同的条件执行不同的操作。一、Switch 语句使用switch语句选择要执行的多个代码块中的一个。1

Switch是与if ... else ...相同的条件语句,不同之处在于switch语句允许根据值列表测试变量是否相等。switch 语句用于根据不同的条件执行不同的操作。X7b28资讯网——每日最新资讯28at.com

X7b28资讯网——每日最新资讯28at.com

一、Switch 语句

使用switch语句选择要执行的多个代码块中的一个。X7b28资讯网——每日最新资讯28at.com

1. 语法

switch(expression) {    case n:        code block        break;    case n:        code block        break;    default:        default code block}

2. 工作原理

switch 表达式求值一次。表达式的值与每个case的值进行比较。如果有匹配,则执行相关的代码块。X7b28资讯网——每日最新资讯28at.com

getDay() 方法返回一周0到6之间的数字。(Sunday=0, Monday=1, Tuesday=2 ..)。X7b28资讯网——每日最新资讯28at.com

3. 案例

使用的工作日数计算星期的名称:X7b28资讯网——每日最新资讯28at.com

<!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8">  <title>项目</title></head><body>  <p id="demo"></p>  <script>    var day;    switch (new Date().getDay()) {        case 0:            day = "Sunday";            break;        case 1:            day = "Monday";            break;        case 2:            day = "Tuesday";            break;        case 3:            day = "Wednesday";            break;        case 4:            day = "Thursday";            break;        case 5:            day = "Friday";            break;        case  6:            day = "Saturday";    }    document.getElementById("demo").innerHTML = "今天是:" + day;</script></body></html>

X7b28资讯网——每日最新资讯28at.com

二、关键字

1. break 关键字

原理:当找到一个匹配,工作完成后,它跳出。如果没有,继续进行更多的测试。X7b28资讯网——每日最新资讯28at.com

一个break可以节省大量的执行时间,因为它忽略了break开关块中所有其他代码都要执行。在最后一个case块中没有必要使用break,因为无论如何它都会退出。X7b28资讯网——每日最新资讯28at.com

<script>function myFunc() {var num = Number(document.querySelector("input").value);var text;switch (num) {   case 1:    text = "您输入的号码是 1";   case 2:    text = "您输入的号码是 2";   case 3:    text = "您输入的号码是 3";   case 4:    text = "您输入的号码是 4";   case 5:    text = "您输入的号码是 5";        braek;   default:    text = "执行默认语句";}document.getElementById('para').innerHTML = text;}</script>

图片X7b28资讯网——每日最新资讯28at.com

2. default 关键字

default 关键字指定在没有匹配的情况下运行的代码:X7b28资讯网——每日最新资讯28at.com

getDay() 方法返回一周0到6之间的数字。X7b28资讯网——每日最新资讯28at.com

switch (new Date().getDay()) {    case 6:        text = "星期六;        break;    case 0:        text = "星期天";        break;    default:   /*如果今天不是星期六(6),也不是星期日(0),写一个default信息*/        text = "其他星期";}

X7b28资讯网——每日最新资讯28at.com

default 不一定放到最后一个语句块:X7b28资讯网——每日最新资讯28at.com

switch (new Date().getDay()) {    default:        text = "其他星期";        break;    case 6:        text = "星期六;        break;    case 0:        text = "星期天";}

X7b28资讯网——每日最新资讯28at.com

测试时,是星期四,返回其他星期。X7b28资讯网——每日最新资讯28at.com

X7b28资讯网——每日最新资讯28at.com

注:X7b28资讯网——每日最新资讯28at.com

如果default不是开关块中的最后一个实例,请记住以break结束默认情况。X7b28资讯网——每日最新资讯28at.com

三、相同的代码块(优化)

有时你会希望不同的开关情况下使用相同的代码。X7b28资讯网——每日最新资讯28at.com

在本例中,案例4和5共享相同的代码块,而0和6共享另一个代码块:X7b28资讯网——每日最新资讯28at.com

<script>            var text;            switch (new Date().getDay()) {                case 4:                case 5:                    text = "很快是周末";                    break;                case 0:                case 6:                    text = "这是周末";                    break;                default:                    text = "期待周末";            }            document.getElementById("demo").innerHTML = text;</script>

X7b28资讯网——每日最新资讯28at.com

四、总结

本文基于JavaScript 基础,介绍了switch语句的相关使用。通过工作原理的分析 案例的代码的解析,对于关键字的难点都做了详细的讲解。同时对代码进行了整合和优化。X7b28资讯网——每日最新资讯28at.com

本文链接:http://www.28at.com/showinfo-26-84190-0.html一篇文章带你了解JavaScript switch

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。邮件:2376512515@qq.com

上一篇: fd:一个比Find简单十倍的文件查找命令

下一篇: Python将证件背景更改为白色底

标签:
  • 热门焦点
  • 直屏旗舰来了 iQOO 12和K70 Pro同台竞技

    旗舰机基本上使用的都是双曲面屏幕,这就让很多喜欢直屏的爱好者在苦等一款直屏旗舰,这次,你们等到了。据博主数码闲聊站带来的最新爆料称,Redmi下代旗舰K70 Pro和iQOO 12两款手
  • CSS单标签实现转转logo

    转转品牌升级后更新了全新的Logo,今天我们用纯CSS来实现转转的新Logo,为了有一定的挑战性,这里我们只使用一个标签实现,将最大化的使用CSS能力完成Logo的绘制与动画效果。新logo
  • 学习JavaScript的10个理由...

    作者 | Simplilearn编译 | 王瑞平当你决心学习一门语言的时候,很难选择到底应该学习哪一门,常用的语言有Python、Java、JavaScript、C/CPP、PHP、Swift、C#、Ruby、Objective-
  • 只需五步,使用start.spring.io快速入门Spring编程

    步骤1打开https://start.spring.io/,按照屏幕截图中的内容创建项目,添加 Spring Web 依赖项,并单击“生成”按钮下载 .zip 文件,为下一步做准备。请在进入步骤2之前进行解压。图
  • 腾讯盖楼,字节拆墙

    来源 | 光子星球撰文 | 吴坤谚编辑 | 吴先之&ldquo;想重温暴刷深渊、30+技能搭配暴搓到爽的游戏体验吗?一起上晶核,即刻暴打!&rdquo;曾凭借直播腾讯旗下代理格斗游戏《DNF》一
  • 腾讯VS网易,最卷游戏暑期档,谁能笑到最后?

    作者:无锈钵来源:财经无忌7月16日晚,上海1862时尚艺术中心。伴随着幻象的精准命中,硕大的荧幕之上,比分被定格在了14:12,被寄予厚望的EDG战队以绝对的优势战胜了BLG战队,拿下了总决
  • 年轻人的“职场羞耻感”,无处不在

    作者:冯晓亭 陶 淘 李 欣 张 琳 马舒叶来源:燃次元&ldquo;人在职场,应该选择什么样的着装?&rdquo;近日,在网络上,一个与着装相关的帖子引发关注,在该帖子里,一位在高级写字楼亚洲金
  • 华为Mate60系列模具曝光:采用硕大圆形后置相机模组+拼接配色方案

    据此前多方爆料,今年华为将开始恢复一年双旗舰战略,除上半年推出的P60系列外,往年下半年的Mate系列也将迎来更新,有望在9-10月份带来全新的华为Mate60
  • 三星Galaxy Z Fold5官方渲染图曝光:13.4mm折叠厚度依旧感人

    据官方此前宣布,三星将于7月26日在韩国首尔举办Unpacked活动,届时将带来带来包括Galaxy Buds 3、Galaxy Watch 6、Galaxy Tab S9、Galaxy Z Flip 5、
Top