【Java Web学习 | 第八篇】JavaScript(2) 基础知识2

【Java Web学习 | 第八篇】JavaScript(2) 基础知识2

🌈个人主页: Hygge_Code🔥热门专栏:从0开始学习Java | Linux学习| 计算机网络💫个人格言: “既然选择了远方,便不顾风雨兼程”

在这里插入图片描述

文章目录

JavaScript 运算符与流程控制全解析

在 JavaScript 中,运算符和流程控制是实现逻辑处理的基础。本文在前文基础上补充for循环内容,全面讲解比较运算符、逻辑运算符、条件判断语句(if、switch)及循环语句(while、for),帮助你掌握 JavaScript 的逻辑构建能力。

一、运算符:自增、比较与逻辑🥝

1. 自增运算符(++)

自增运算符分为前缀(++i)和后缀(i++),核心区别在于返回值时机:

  • 后缀自增(i++):先返回当前值,再自增
  • 前缀自增(++i):先自增,再返回新值
let i =1; console.log(i+++++i + i);// 结果为7// 解析:// 1. i++ 先返回1,i变为2// 2. ++i 先自增为3,返回3// 3. 此时i=3,总和:1+3+3=7

2. 比较运算符

用于判断值的关系,返回布尔值,需重点区分=====

运算符特点示例结果
==只比较值(隐式转换类型)2 == "2"true(字符串转数字)
===比较值和类型(无转换)2 === "2"false(类型不同)
!=只比较值不相等2 != "2"false(值相等)
!==比较值或类型不相等2 !== "2"true(类型不同)

特殊规则

  • 字符串按字符编码比较(如"a" < "b"true
  • NaN与任何值比较都返回false(包括自身)
console.log(2=="2");// true(隐式转换) console.log(2==="2");// false(类型不同) console.log("aabgg"<"bzzzz");// true(首字符"a"<"b")

3. 逻辑运算符

组合多个条件判断,返回布尔值:

运算符描述示例结果
&&逻辑与(两边都真才真)3<5 && 3<9true
两条竖线(打不出来)逻辑或(至少一边真则真)3<5 两条竖线 3>100true
!逻辑非(取反)!(2>5)true

真值/假值规则

  • 假值:0""nullundefinedNaN
  • 真值:除假值外的所有值(如非空字符串、非0数字)
console.log(!9);// false(9是真值) console.log(!"");// true(空字符串是假值)

二、条件判断语句🥝

1. if 语句

根据条件执行代码块,条件会隐式转换为布尔值:

// 语法if(条件){// 条件为真时执行}else{// 条件为假时执行}// 示例:判断空格字符串是否为真if(" "){// 空格字符串是真值(非空) console.log(true);// 输出:true}else{ console.log(false);}

2. 三目运算符

if-else的简写形式:条件 ? 表达式1 : 表达式2

// 判断2与"2"是否绝对相等 document.write(2==="2"?"相等":"不等");// 输出:不等

3. switch 语句

用于多条件等值判断(使用===比较),需配合break防止穿透:

let num5 =3;switch(num5){case1: console.log("选了1");break;case2: console.log("选了2");break;case3: console.log("选了3");// 匹配成功,输出此句break;default: console.log("无匹配项");}// 输出:选了3

三、循环语句🥝

1. while 循环

根据条件重复执行代码块,continue可跳过本次循环:

let n =5;while(n--){// n从5递减到0if(n ===3)continue;// 跳过n=3的循环 document.write(`执行第${n}次<br/>`);}// 输出:// 执行第4次// 执行第2次// 执行第1次// 执行第0次

2. for 循环

更灵活的循环方式,适合已知循环次数的场景,语法:

for(初始化; 条件; 更新){// 循环体}

示例:基本用法

// 输出1-5for(let i =1; i <=5; i++){ console.log(i);// 依次输出1、2、3、4、5}

总结🍂

本文全面讲解了 JavaScript 核心运算符和流程控制:

  • 自增运算符的前缀/后缀差异影响返回值
  • 比较运算符中=====更严格(检查类型)
  • 逻辑运算符依赖真值/假值转换
  • 条件判断:if适合区间判断,switch适合等值判断
  • 循环:while适合未知次数,for适合已知次数,灵活使用continuebreak

如果我的内容对你有帮助,请 点赞 , 评论 , 收藏 。创作不易,大家的支持就是我坚持下去的动力!

在这里插入图片描述

Read more

【前端部署在云服务器如何与本地联调--Frp内网穿透】

【前端部署在云服务器如何与本地联调--Frp内网穿透】

苍穹外卖前端部署在云服务器如何与本地联调--Frp内网穿透 * 1. 前言 * 2. FRP是什么 * 3. 解决步骤 * 3.1 在云服务器安装服务端frps,然后开启开机自启(**参考第4部分**) * 3.2 在本地电脑安装客户端fprc(**参考第4部分**) * 4. Frp(C/S)0.64.0各个系统的安装方法 * 4.1 frps安装(Linux)服务端 * 4.2 frpc安装(windows)客户端 * 4.3 frpc安装(==mac==)客户端 * 4.4 frpc安装(Linux)客户端 1. 前言 写这片文章的目的是为了解决上篇苍穹外卖项目的前端部署到云服务器的遗留问题:前端的云服务器的IP是公网IP,而我本地调试的Java后端是内网,前端响应的地址找不到本地的服务器。那么如何让云服务器上的前端项目能够找到后端的对应的地址呢?

前端实战:基于Vue3与免费满血版DeepSeek实现无限滚动+懒加载+瀑布流模块及优化策略

前端实战:基于Vue3与免费满血版DeepSeek实现无限滚动+懒加载+瀑布流模块及优化策略

目录 前端实战:基于Vue3与免费满血版DeepSeek实现无限滚动+懒加载+瀑布流模块及优化策略 一、前言 二、如何使用腾讯云免费满血版deepseek 1、腾讯云大模型知识引擎体验中心 2、体验deepseek联网助手 3、人机交互获取AI支持 三、基于DeepSeek实现无限滚动+懒加载+瀑布流模块 1、无限滚动+懒加载+瀑布流模块的底层逻辑 2、人机交互策略与Deepseek的实现过程 ①虚拟列表管理 ②布局容器初始化 ③动态渲染与销毁机制 ④无线滚动实现 ⑤内存优化策略 四、最终代码呈现 1、组件代码 2、组件用法 五、结语         作者:watermelo37         ZEEKLOG万粉博主、华为云云享专家、阿里云专家博主、腾讯云、支付宝合作作者,全平台博客昵称watermelo37。         一个假装是giser的coder,做不只专注于业务逻辑的前端工程师,Java、Docker、

在自动化脚本中如何在自定义ui中使用webview来无限扩展ui?

在自动化脚本开发中,原生 UI 控件虽能满足基础的界面展示与交互需求,但面对复杂的页面逻辑、动态的内容渲染以及个性化的交互设计时,其扩展性会受到一定限制。WebView 控件能够将网页的灵活开发特性与自动化脚本的原生能力深度融合,实现 UI 的无限扩展。本文将从 WebView 的集成原理、与自动化脚本的无缝交互方式出发,结合完整的 Demo 源码,详细讲解如何在UI 中高效集成 WebView,让 H5 页面与原生自动化脚本协同工作,打造更灵活、更强大的自动化交互界面。 一、WebView 核心能力与集成前提 1.1 WebView 的核心价值  WebView 控件并非简单的网页加载容器,而是打通了原生自动化脚本与H5 网页的双向通信通道,其核心价值体现在三个方面: 1. UI 扩展无限化:借助 H5 的生态优势,实现原生 UI 难以开发的复杂界面,如数据可视化图表、动态表单、

Spring Boot 3.x RestTemplate迁移至WebClient问题详解与解决方案

目录 * Spring Boot 3.x RestTemplate迁移至WebClient问题详解与解决方案 * 一、RestTemplate弃用背景与迁移策略 * 1.1 弃用原因分析 * 1.2 迁移依赖配置 * 二、核心迁移方案:RestTemplate ↔ WebClient映射 * 2.1 基础迁移对照表 * 2.2 复杂场景迁移 * 三、错误处理机制迁移 * 3.1 错误处理对照 * 3.2 统一错误处理策略 * 四、异步到同步的桥接方案 * 4.1 阻塞式适配器 * 4.2 Spring MVC控制器中的WebClient使用 * 五、测试策略迁移 * 5.1 单元测试对比 * 5.2 集成测试工具类 * 六、