【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

使用Dexie操作前端数据库IndexedDB 教程

使用Dexie操作前端数据库IndexedDB 教程 Dexie.js 是对前端本地数据库 IndexedDB 的 API 进行封装的轻量级库,它简化了 IndexedDB 复杂的原生操作,提供了更简洁、直观的语法,便于开发者快速实现前端本地数据的持久化存储。 一、为什么选择 IndexedDB? 前端常见的本地存储方案(Cookie、LocalStorage、SessionStorage)均存在存储容量限制,无法满足大数据量的存储需求。IndexedDB 作为浏览器原生的本地数据库,具备大容量存储优势,具体对比如下: * Cookie:存储容量不超过 4KB,主要用于存储会话标识等少量信息; * LocalStorage:存储容量介于 2.5MB ~ 10MB 之间,仅支持字符串存储; * SessionStorage:存储容量与 LocalStorage 相当,但仅在当前会话有效,页面关闭后数据丢失; * IndexedDB:存储容量不低于 250MB,支持占用本地磁盘空间的 50%

【Rust编程】Actix-web 开发环境搭建完整教程

【Rust编程】Actix-web 开发环境搭建完整教程

Actix-web 开发环境搭建完整教程 * Actix-web 开发环境搭建完整教程 * 一、前置准备:安装 Rust 工具链 * 1. 安装 Rustup(Rust 版本管理器) * 2. 验证安装 * 3. 配置国内镜像源(加速依赖下载) * 4. 安装开发工具 * 二、创建 Actix-web 项目 * 1. 创建项目骨架 * 2. 添加 Actix-web 依赖 * 三、编写第一个 Actix-web 应用 * 1. 基础代码(`src/main.rs`) * 2. 配置环境变量(可选) * 四、运行与测试服务 * 1. 启动开发服务器 * 2. 测试端点 * 3.

基于YOLOv的毕业设计Web系统:AI辅助开发全流程实战与避坑指南

最近在帮学弟学妹们看毕业设计,发现很多同学在用YOLOv系列模型做目标检测,然后想把它做成一个Web应用展示出来。想法很好,但实际做的时候,各种问题就来了:模型加载慢得像蜗牛,前端调接口调得怀疑人生,本地跑得好好的,一部署到服务器就各种报错。我自己也踩过不少坑,今天就把从零搭建一个“基于YOLOv的毕业设计Web系统”的全流程,以及如何用一些现代工具(AI辅助开发思路)来提效避坑的经验,梳理成这篇笔记。 1. 先聊聊大家常遇到的“坑” 做这类项目,尤其是第一次接触全栈的同学,痛点非常集中: * “我的模型怎么这么慢?”:在Jupyter里跑得飞快,一集成到Web后端,每次请求都重新加载模型,或者推理速度不稳定,页面卡半天。 * “前后端联调是玄学”:用Flask写个简单接口,前端用jQuery或者原生JS去调,图片上传格式不对、返回数据解析出错,调试基本靠print和浏览器F12,效率极低。 * “环境依赖,永远的痛”:本地是Python 3.8 + PyTorch 1.12 + CUDA 11.3,服务器可能是另一套。pip

python:Flask 3, mistune 2, 实现在线编辑 Markdown 文档的 Web 服务程序

承上一篇: nodejs: 能在线编辑 Markdown 文档的 Web 服务程序,更多扩展功能 模仿 app2.js, 请用 python编程 : flask 3, mistune 2, 或者其它模块 实现同样功能的Web服务 以下是使用 Flask 3 + Mistune 2 实现与 app2.js 相同功能的 Python Web 服务,包含 Markdown 解析(支持代码高亮、Mermaid、表格、公式)、文档保存/加载/列表查询等核心功能: 1. 先安装依赖 pip install flask==3.0.3 mistune=