当前位置: 首页 > news >正文

7.JS里表达式,if条件判断,三元运算符,switch语句,断点调试

表达式和语句的区别

表达式就是可以被求值的代码比如什么a = 1
语句就是一段可以执行的代码比如什么if else
直接给B站的黑马程序员的老师引流一波总结的真好
在这里插入图片描述

分支语句

在这里插入图片描述

就是基本上所有的语言都会有的if else 语句就是满足不同的条件执行不同的代码,让计算机有条件判断的能力。
注意在if的括号里面除了数字0之外所有的数字直接写的话都是true下面直接看代码把

<!DOCTYPE html>
<html>
<head><title>条件判断示例</title>
</head>
<body><script>let age = Number(prompt("请输入您的年龄:"))if (age > 18) {alert('你成年了')} else if (age === 18) {  // 注意是===alert('你刚刚满18岁')} else {alert('你没有成年')}// if 后面的括号里除了空字符串和数字0之外其他都是trueif (0){console.log('0是true')} else {console.log('0不是true')}if (''){console.log('空字符串是true')} else {console.log('空字符串不是true')}</script>
</body>
</html>

运行结果
这里还会看见弹窗让输入年龄
在这里插入图片描述

三元运算符

一些简单的条件判断使用三元运算符可以增加代码的可读性,但是复杂的条件判断一定要杜绝使用三元运算符!!!!一般在开发过程中都是为了取值的,反我是这样
上代码:

<!DOCTYPE html>
<html>
<head><title>条件判断示例</title>
</head>
<body><script>console.log(1>5 ? '1大于5' : '1小于5')let num = 10 > 5 ? 10 : 5  // 开发过程中一般都是用于取值console.log(num)</script>
</body>
</html>

结果

在这里插入图片描述

switch语句

主要用于各种分支判断,主要用于 那种等值判断其实开发过程中不推荐使用switch语句

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8" /><title>switch 语句示例</title>
</head>
<body><script>let userInput = prompt("请输入一个数字");if (userInput !== null) {userInput = parseInt(userInput);switch (userInput) {case 1:alert("您输入的数字是 1");break;case 2:alert("您输入的数字是 2");break;case 3:alert("您输入的数字是 3");break;default:alert("您输入的数字不在范围内");}} else {alert("您取消了输入");}</script>
</body>
</html>

在这个示例中,页面加载后会弹出一个 prompt 输入框,用户可以在输入框中输入数字。根据用户输入的数字,使用 switch 语句进行判断,并弹出不同的提示框信息。如果用户点击了 prompt 的取消按钮,则会提示用户取消了输入。

断点调试

断点调试是开发过程中非常重要的一个环节
首先写一个小案例

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8" /><title>断点调试</title>
</head>
<body><script>let num = 10num = num + 1console.log(num)</script>
</body>
</html>

然后打开页面的开发者工具点击源代码,在想要打断点的地方点击一下然后注意一定要刷新网页
在这里插入图片描述

在这里插入图片描述

这个断点就打成功了,然后在断点的时候你把鼠标放在变量上会显示这个变量当前的值,对于循环的值的追踪非常好,看一个bug啥的也非常的方便

相关文章:

7.JS里表达式,if条件判断,三元运算符,switch语句,断点调试

表达式和语句的区别 表达式就是可以被求值的代码比如什么a 1 语句就是一段可以执行的代码比如什么if else 直接给B站的黑马程序员的老师引流一波总结的真好 分支语句 就是基本上所有的语言都会有的if else 语句就是满足不同的条件执行不同的代码&#xff0c;让计算机有条件…...

RK3568平台开发系列讲解(存储篇)文件句柄与文件描述符介绍

🚀返回专栏总目录 文章目录 一、什么是文件句柄二、什么是文件描述符2.1、files_struct 结构体2.2、fdtable 结构体三、数据结构关系图沉淀、分享、成长,让自己和他人都能有所收获!😄 一、什么是文件句柄 用户空间的进程通过open系统调用打开一个文件之后,内核返回的就是…...

【C++】类和对象(五)友元、内部类、匿名对象

前言&#xff1a;前面我们说到类和对象是一个十分漫长的荆棘地&#xff0c;今天我们将走到终点&#xff0c;也就是说我们对于&#xff23;算是正式的入门了。 &#x1f496; 博主CSDN主页:卫卫卫的个人主页 &#x1f49e; &#x1f449; 专栏分类:高质量&#xff23;学习 &…...

攻防世界 CTF Web方向 引导模式-难度1 —— 1-10题 wp精讲

目录 view_source robots backup cookie disabled_button get_post weak_auth simple_php Training-WWW-Robots view_source 题目描述: X老师让小宁同学查看一个网页的源代码&#xff0c;但小宁同学发现鼠标右键好像不管用了。 不能按右键&#xff0c;按F12 robots …...

Docker之MongoDB安装、创建用户及登录认证

Docker之MongoDB安装、创建用户及登录认证 文章目录 Docker之MongoDB安装、创建用户及登录认证1. 拉取镜像2. 创建宿主机容器数据卷3. 运行mongodb容器1. 运行容器2. 创建用户3. 创建数据库并设置密码 1. 拉取镜像 docker pull mongo:4.2.212. 创建宿主机容器数据卷 运行docke…...

紫微斗数双星组合:天机天梁在辰戌

文章目录 前言内容总结 前言 紫微斗数双星组合&#xff1a;天机天梁在辰戌 内容 紫微斗数双星组合&#xff1a;天机天梁在辰戌 性格分析 在紫微斗数命盘中&#xff0c;天梁星是一颗“荫星”&#xff0c;能够遇难呈祥&#xff0c;化解凶危&#xff0c;主寿&#xff0c;主贵。…...

N-144基于微信小程序在线订餐系统

开发工具&#xff1a;IDEA、微信小程序 服务器&#xff1a;Tomcat9.0&#xff0c; jdk1.8 项目构建&#xff1a;maven 数据库&#xff1a;mysql5.7 前端技术&#xff1a;vue、ElementUI、 Vant Weapp 服务端技术&#xff1a;springbootmybatisredis 本系统分微信小程序和…...

[UI5 常用控件] 09.IconTabBar,IconTabHeader,TabContainer

文章目录 前言1. IconTabBar1.1 简介1.2 基本结构1.3 用法1.3.1 颜色&#xff0c;拖放&#xff0c;溢出1.3.2 Icons Only , Inner Contents1.3.3 showAll,Count,key,IconTabSeparator 1.3.4 Only Text1.3.5 headerMode-Inline1.3.6 design,IconTabSeparator-icon1.3.7 DensityM…...

CCF编程能力等级认证GESP—C++5级—20231209

CCF编程能力等级认证GESP—C5级—20231209 单选题&#xff08;每题 2 分&#xff0c;共 30 分&#xff09;判断题&#xff08;每题 2 分&#xff0c;共 20 分&#xff09;编程题 (每题 25 分&#xff0c;共 50 分)小杨的幸运数烹饪问题 答案及解析单选题判断题编程题1编程题2 单…...

【论文精读】GPT2

摘要 在单一领域数据集上训练单一任务的模型是当前系统普遍缺乏泛化能力的主要原因&#xff0c;要想使用当前的架构构建出稳健的系统&#xff0c;可能需要多任务学习。但多任务需要多数据集&#xff0c;而继续扩大数据集和目标设计的规模是个难以处理的问题&#xff0c;所以只能…...

10-k8s中pod的探针

一、探针的概念 一般时候&#xff0c;探针的设置&#xff0c;都是为了优化业务时&#xff0c;需要做的事情&#xff1b;属于后期工作&#xff1b; 1&#xff0c;探针的分类 1&#xff0c;健康状态检查探针&#xff1a;livenessProbe 当我们设置了这个探针之后&#xff0c;检查…...

【Langchain Agent研究】SalesGPT项目介绍(二)

【Langchain Agent研究】SalesGPT项目介绍&#xff08;一&#xff09;-CSDN博客 上节课&#xff0c;我们介绍了SalesGPT他的业务流程和技术架构&#xff0c;这节课&#xff0c;我们来关注一下他的项目整体结构、poetry工具和一些工程项目相关的设计。 项目整体结构介绍 我们把…...

《UE5_C++多人TPS完整教程》学习笔记4 ——《P5 局域网连接(LAN Connection)》

本文为B站系列教学视频 《UE5_C多人TPS完整教程》 —— 《P5 局域网连接&#xff08;LAN Connection&#xff09;》 的学习笔记&#xff0c;该系列教学视频为 Udemy 课程 《Unreal Engine 5 C Multiplayer Shooter》 的中文字幕翻译版&#xff0c;UP主&#xff08;也是译者&…...

【运维测试】移动测试自动化知识总结第1篇:移动端测试介绍(md文档已分享)

本系列文章md笔记&#xff08;已分享&#xff09;主要讨论移动测试相关知识。主要知识点包括&#xff1a;移动测试分类及android环境搭建&#xff0c;adb常用命令&#xff0c;appium环境搭建及使用&#xff0c;pytest框架学习&#xff0c;PO模式&#xff0c;数据驱动&#xff0…...

高校疫情防控系统的全栈开发实战

✍✍计算机编程指导师 ⭐⭐个人介绍&#xff1a;自己非常喜欢研究技术问题&#xff01;专业做Java、Python、微信小程序、安卓、大数据、爬虫、Golang、大屏等实战项目。 ⛽⛽实战项目&#xff1a;有源码或者技术上的问题欢迎在评论区一起讨论交流&#xff01; ⚡⚡ Java实战 |…...

OpenTitan- 开源安全芯片横空出世

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗&#xff1f;订阅我们的简报&#xff0c;深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同&#xff0c;从行业内部的深度分析和实用指南中受益。不要错过这个机会&#xff0c;成为AI领…...

简单的edge浏览器插件开发记录

今天在浏览某些网页的时候&#xff0c;我想要屏蔽掉某些信息或者修改网页中的文本的颜色、背景等等。于是在浏览器的控制台中直接输入JavaScript操作dom完成了我想要的功能。但是每次在网页之间跳转该功能都会消失&#xff0c;我需要反复复制粘贴js脚本&#xff0c;无法实现自动…...

WSL下如何使用Ubuntu本地部署Vits2.3-Extra-v2:中文特化修复版(新手从0开始部署教程)

环境&#xff1a; 硬&#xff1a; 台式电脑 1.cpu:I5 11代以上 2.内存16G以上 3.硬盘固态500G以上 4.显卡N卡8G显存以上 20系2070以上 本案例英伟达4070 12G 5.网络可连github 软&#xff1a; Win10 专业版 19045以上 WSL2 -Ubuntu22.04 1.bert-Vits2.3 Extra-v2:…...

Go语言的100个错误使用场景(40-47)|字符串函数方法

前言 大家好&#xff0c;这里是白泽。 《Go语言的100个错误以及如何避免》 是最近朋友推荐我阅读的书籍&#xff0c;我初步浏览之后&#xff0c;大为惊喜。就像这书中第一章的标题说到的&#xff1a;“Go: Simple to learn but hard to master”&#xff0c;整本书通过分析100…...

Fluke ADPT 连接器新增对福禄克万用 Fluke 15B Max 的支持

所需设备&#xff1a; 1、Fluke ADPT连接器&#xff1b; 2、Fluke 15B Max&#xff1b; Fluke 15B Max拆机图&#xff1a; 显示界面如下图&#xff1a; 并且可以将波形导出到EXCEL: 福禄克万用表需要自己动手改造&#xff01;&#xff01;&#xff01;...

双碳时代,能源调度的难题正从“发电侧”转向“企业侧”

安科瑞刘鸿鹏 摘要 在“双碳”战略和能源结构转型的大背景下&#xff0c;企业储能电站逐步成为提升能源利用效率、增强用能韧性的重要手段。随着系统规模扩大与运行复杂度提升&#xff0c;如何对光伏、储能、负荷等流进行实时调控&#xff0c;成为智慧用能的关键。ACCU100微…...

Linux基础命令which 和 find 简明指南

&#x1f3af; Linux which 和 find 命令简明指南&#xff1a;从入门到实用 &#x1f4c5; 更新时间&#xff1a;2025年6月7日 &#x1f3f7;️ 标签&#xff1a;Linux | which | find | 命令行 | 文件查找 文章目录 前言&#x1f31f; 一、Linux 命令的本质与 which、find 的作…...

内嵌式mqtt server

添加moquette依赖 <dependency><groupId>io.moquette</groupId><artifactId>moquette-broker</artifactId><version>0.17</version><exclusions><exclusion><groupId>org.slf4j</groupId><artifactId>…...

虚拟机CentOS 7 网络连接显示“以太网(ens33,被拔出)“、有线已拔出、CentOS7不显示网络图标

文章目录 一、问题描述二、解决方法1、查看网络连接方式2、开启相关服务3、确认虚拟机网络连接 一、问题描述 问题描述&#xff1a;在VmWare中安装CentOS7, 启动后界面不显示网络的图标。 在GONE桌面—》设置中找到网络设置&#xff0c;发现显示线缆已拔出。 二、解决方法 …...

中医的十问歌和脉象分类

中医核心理论框架如下 诊断技术如下 本文主要介绍问诊和切诊。 十问歌的“十”是虚指&#xff0c;实际包含12个核心问题&#xff0c;脉象28种中常见仅10余种&#xff0c;重点解释脉诊的物理本质&#xff08;血流动力学触觉感知&#xff09; 以下是中医十问歌的完整内容及脉…...

五、查询处理和查询优化

五、查询处理和查询优化 主要内容 查询概述查询处理过程关系操作的基本实现算法查询优化技术代数优化基于存取路径的优化基于代价估算的优化 1. 查询概述 查询是数据库管理系统中使用最频繁、最基本的操作&#xff0c;对系统性能有很大影响。 对于同一个SQL查询&#xff0c…...

极智项目 | 基于PyQT+Whisper实现的语音识别软件设计

这是一个基于OpenAI的Whisper模型的语音识别应用程序&#xff0c;使用PyQt5构建了简洁直观的用户界面。该应用支持多语言识别&#xff0c;特别优化了中文识别体验。 项目下载&#xff1a;链接 功能特点 简洁现代的深色主题界面支持多语言识别&#xff08;中文、英语、日语等…...

新华三H3CNE网络工程师认证—Easy IP

Easy IP 就是“用路由器自己的公网IP&#xff0c;给全家所有设备当共享门牌号”的技术&#xff01;&#xff08;省掉额外公网IP&#xff0c;省钱又省配置&#xff01;&#xff09; 生活场景对比&#xff0c;想象你住在一个小区&#xff1a;普通动态NAT&#xff1a;物业申请了 …...

惠普HP Deskjet 9600 打印机信息

基本参数 产品定位&#xff1a;彩色喷墨打印机。打印速度&#xff1a;14 页 / 分钟。最高分辨率&#xff1a;48001200dpi。打印内存&#xff1a;8MB4。打印语言&#xff1a;HP PCL 3 增强型。打印负荷&#xff1a;每月 5000 页。接口类型&#xff1a;USB、并口。 功能特点 自动…...

【时时三省】(C语言基础)局部变量和全局变量

山不在高&#xff0c;有仙则名。水不在深&#xff0c;有龙则灵。 ----CSDN 时时三省 以前所见到的程序大多数是一个程序只包含一个main函数&#xff0c;变量是在函数的开头处定义的。这些变量在本函数范围内有效&#xff0c;即在本函数开头定义的变量&#xff0c;在本函数中可…...