js选择语句

文章目录

  • [1. if 分支语句](#1. if 分支语句)
    • [1.1. 示例代码](#1.1. 示例代码)
    • [1.2. 运行结果](#1.2. 运行结果)
  • [2. if 双分支语句](#2. if 双分支语句)
  • [3. if 多分支语句](#3. if 多分支语句)
  • [4. switch 语句(了解)](#4. switch 语句(了解))
    • [4.1. 注意](#4.1. 注意)
    • [4.2. case 穿透现象](#4.2. case 穿透现象)
    • [4.3. case 穿透产生的原因](#4.3. case 穿透产生的原因)
  • [5. switch 语句与选择语句区别别](#5. switch 语句与选择语句区别别)
    • [5.1. 语法上的区别](#5.1. 语法上的区别)
    • [5.2. 应用场景上的区别](#5.2. 应用场景上的区别)
  • [6. 三元表达式](#6. 三元表达式)
    • [6.1. 语法法](#6.1. 语法法)
    • [6.2. 示例代码](#6.2. 示例代码)
  • [7. 练习 1](#7. 练习 1)
    • [7.1. 题目](#7.1. 题目)
    • [7.2. 示例代码](#7.2. 示例代码)
    • [7.3. 运行结果](#7.3. 运行结果)
  • [8. 练习 2](#8. 练习 2)
    • [8.1. 题目](#8.1. 题目)
    • [8.2. 示例代码](#8.2. 示例代码)
    • [8.3. 运行结果](#8.3. 运行结果)
  • [9. 练习 3](#9. 练习 3)
    • [9.1. 题目](#9.1. 题目)
      • [9.1.1. 示例代码](#9.1.1. 示例代码)
  • [10. 练习 4](#10. 练习 4)
    • [10.1. 题目](#10.1. 题目)
    • [10.2. 代码实现 1](#10.2. 代码实现 1)
    • [10.3. 代码实现 2](#10.3. 代码实现 2)
    • [10.4. 运行结果](#10.4. 运行结果)

1. if 分支语句

语法:

js 复制代码
if (条件表达式) {
  // 满足条件要执行的语句
}

if 中的内容如果为true ,就执行大括号的代码块,如果为false 执行else代码块。

1.1. 示例代码

html 复制代码
<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>js第二天</title>
  </head>
  <body>
    <script>
      // if分支语句
      const condition = 6 > 4;
      if (condition) {
        // 代码块1
        alert("yes");
      } else {
        // 代码块2
        alert("no");
      }
    </script>
  </body>
</html>

1.2. 运行结果

2. if 双分支语句

如果有两个条件的时候,可以使用 if else 双分支语句。

js 复制代码
if (条件表达式) {
  // 满足条件要执行的语句
} else {
  // 不满足条件要执行的语句
}

3. if 多分支语句

使用场景: 适合于有多个条件的时候。

语法:

js 复制代码
         if(条件表达式1){
         	语句体1
         }else if(条件表达式2){
         	语句体2
         }else if(条件表达式3){
         	语句体3
         }else if(条件表达式4){
         	语句体4
         }
         ...
         else{
         	语句体2
         }

从上往下,依次判断每一个条件,如果满足,就会执行对应的语句体,剩下的即使满足也不会执行。

4. switch 语句(了解)

switch case 传入一个变量,判断这个变量,是否符合case 中的条件,符合条件,就执行下面的代码块,每个代码块用break。如果都不满足,就执行 default 中的语句。

语法:

js 复制代码
switch语句用来定义多分支条件语句,语法如下:
	switch(表达式){
    case 值1:
      执行体1;
      break;

    case 值2:
      执行体2;
      break;
    ...
    default:
    	默认执行体;
      break; //default语句中break可有可无。
  }

4.1. 注意

  1. switch case一般需要配合break 关键字使用 没有break 会造成case穿透。
  2. 当前结果只有固定几个取值,可以使用 switch。
  3. if 多分支语句开发要比 switch 更重要,使用也更多。

4.2. case 穿透现象

case 穿透会从满足条件的那个语句开始,依次执行,即使后面的 case 不满足条件,也会执行,直到出现 break 才会跳出 switch 语句。

4.3. case 穿透产生的原因

如果忘记加 break,就会产生 case 的穿透(break 是可以用于结束 switch 语句)。

5. switch 语句与选择语句区别别

5.1. 语法上的区别

  1. ifif-else语句一次只能判断一个条件,而if-elseifswitch一次可以判断多个条件。

  2. if-elseifswitch的结构非常类似,所有的switch语句都可以使用if-elseif改写。

  3. 所有的if-elseif不一定能用switch改写。

5.2. 应用场景上的区别

if 语句主要用于范围的判断 ,switch 主要用于等值判断

如果结果确定有几个值,可以考虑使用 switch。

6. 三元表达式

6.1. 语法法

js 复制代码
条件 ? 表达式1 : 表达式2
// 执行过程:
// 1. 如果条件为真,则执行表达式1
// 2. 如果条件为假,则执行表达式2

6.2. 示例代码

js 复制代码
// 补0
// 1. 用户输入
let num = prompt("请您输入一个数字:");
// 2. 判断输出- 小于10才补0
// num = num < 10 ? 0 + num : num
num = num >= 10 ? num : 0 + num;
alert(num);

7. 练习 1

7.1. 题目

  1. 输入你用的手机

  2. 如果输入的是苹果,alert("土豪")

  3. 如果是华为,alert("遥遥领先!!!")

  4. 如果是小米,alert("性价比")

7.2. 示例代码

js 复制代码
const phone = prompt("请输入你的手机牌子:");
const resName = phone.slice(0, 2);
switch (resName) {
  case "苹果":
    alert("土豪");
    break;
  case "华为":
    alert("遥遥领先!!!");
    break;
  case "小米":
    alert("性价比");
    break;
  default:
    alert("不认识你的杂牌子手机");
    break;
}

7.3. 运行结果

8. 练习 2

8.1. 题目

请输入您的工作年限:

  1. 如果你的工作年限小于 1 年,你的年假是 5 天

  2. 如果你的工作年限小于 3 年,你的年假是 7 天

  3. 如果你的工作年限大于等于 3 年,你的年假是 15 天

8.2. 示例代码

javascript 复制代码
let workYears = prompt("请输入您的工作年限:");

// 你的年假,初始化为null
let hoilday = null;
if (workYears < 0) {
  hoilday = 0;
} else if (workYears < 1) {
  hoilday = 5;
} else if (workYears < 3) {
  hoilday = 7;
} else if (workYears >= 3) {
  hoilday = 15;
}
//弹出对话框
alert("你的年假是" + hoilday);

8.3. 运行结果

9. 练习 3

9.1. 题目

老爸根据成绩奖励儿子(成绩在 0-100 之间)

  1. 考了 90-100,奖励兰博基尼,带电池
  2. 考了 80-90,奖励自行车
  3. 考了 70-80,奖励滑板
  4. 70 分以下,奖励胖揍一顿

9.1.1. 示例代码

js 复制代码
//获取儿子分数
let score = prompt("请输入儿子的分数");

//判断
//需要一开始对成绩做一个范围的限定
if (score < 0 || score > 100) {
  alert("你输入的成绩不合法,请输入0-100的整数");
} else {
  if (score >= 90) {
    alert("奖励兰博基尼,带电池");
  } else if (score >= 80) {
    alert("奖励自行车");
  } else if (score >= 70) {
    alert("奖励滑板");
  } else {
    alert("奖励胖揍一顿");
  }
}

10. 练习 4

10.1. 题目

输入一个月份,判断月份属于哪个季节: 12,1,2 冬季 3,4,5 春季 6,7,8 夏季 9,10,11 秋季。

10.2. 代码实现 1

js 复制代码
//获取用户输入的月份
let month = prompt("请输入一个月份");

//判断
switch (
  Number(month) //需要做一个强转,转成数值类型
) {
  case 12:
  case 1:
  case 2:
    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("你输入的不是一个月份");
    break;
}

10.3. 代码实现 2

js 复制代码
//获取用户输入的月份
let month = prompt("请输入一个月份");

//判断
if (month == 12 || month == 1 || month == 2) {
  alert("冬季");
} else if (month == 3 || month == 4 || month == 5) {
  alert("春季");
} else if (month == 6 || month == 7 || month == 8) {
  alert("夏季");
} else if (month == 9 || month == 10 || month == 11) {
  alert("秋季");
} else {
  alert("你输入的不是一个月份");
}

10.4. 运行结果

相关推荐
智商不够_熬夜来凑12 分钟前
【Radio & Checkbox】
前端·javascript·vue.js
xiaofeichaichai20 分钟前
Diff 算法
前端·javascript
wgc2k28 分钟前
Nest.js 基础-8-Hello,NestJS
开发语言·javascript·ecmascript
Larcher32 分钟前
从 0 到 1:用 Bun + axios 快速搭建 LLM API 客户端
前端·javascript
机汇五金_33 分钟前
影响交换机箱体使用寿命的几个关键因素
运维·服务器·网络·python
子午34 分钟前
基于DeepSeek的酒店客房管理系统~Python+DeepSeek智能问答+Vue3+Web网站系统
开发语言·前端·python
bkspiderx36 分钟前
Boa Web服务器HTTPS支持的源码改造方案
服务器·前端·https·web服务器·boa·https支持
无限进步_39 分钟前
Linux进程终止——退出码、exit与_exit
linux·运维·服务器
贺今宵42 分钟前
Vue 3 + Capacitor 使用jeep-sqlite,web端使用本地sqlite数据库
前端·数据库·vue.js·sqlite·web
taocarts_bidfans1 小时前
Google Indexing API 外贸独立站主动推送收录实战开发
前端·独立站·外贸独立站·taoify