【H2O2|全栈】JS入门知识(二)

目录

JS

前言

准备工作

运算符

算数运算符

比较运算符

自增、自减运算符

逻辑运算符

运算符的优先级

分支语句

if-else语句

switch语句

三元表达式

结束语


JS

前言

本系列博客主要分享JavaScript的基础语法知识,本期为第二期,包含一些简单的js语法,以及一道js的面试题。

叠甲:非专业,仅参考。

准备工作

软件:【参考版本】Visual Studio Code

插件(扩展包):Open in browser, Live Preview, Live Server

浏览器版本:Chrome

系统版本: Win10/11/其他非Windows版本

*我的电脑是Win10的版本,仅供参考*

运算符

算数运算符

JS提供了一些常用的运算符号,与算数中的运算符一一对应,所以又叫算数运算符

常见的算数运算符如下:

符号含义
+加法
-减法
*乘法
/除法(除以)
%取余
&与运算(布尔值转化为0/1)
|或运算(布尔值转化为0/1)

比较运算符

JS中,我们常常会遇到一些大小或者属性不一致的值需要比较,这个时候就需要用到我们的比较运算符

常见的比较运算符如下: 

符号含义
==  !=比较两者的值是否一致
===  !==比较两者的类型、值是否都一致
>=  >  <=  <比较两者的值之间的大小关系

自增、自减运算符

如果我们想让一个数字的值在原来的基础上加一,常规的方式是:

a = a + 1

上面的代码实质上实现了运算赋值两个功能。 

想要同时实现这两个功能,我们还可以用自增的方式,自增的方式分为两种:

  • 前自增        ++a
  • 后自增        a++

对于前自增,实际上的操作为先进行+1运算,再参与后续运算,即先赋值,再计算。 

而后自增则是先计算,再赋值。

案例

比如,我现在有下面这个这段代码:

var a = 10, b = 16
let c = a++ + ++b + b++
alert(c)

那么,输出的值应当是多少呢?

分析题目,在赋值式中,第一步是a++,所以参与运算的是10,而a在这里变成了11。

第二步是++b,所以这里是b先变成了17,然后让17参与运算,所以这里的计算变为10 + 17。

第三步是b++,参与运算的是17,然后b变成了18,所以这里的计算变为10 + 17 + 17。

因此,输出的值应当是44。

逻辑运算符

在进行真值判定运算的时候,我们经常需要涉及到逻辑运算符的使用。

常见的逻辑运算符有下面三种:

符号含义
&&(短路)与
||(短路)或

在多个使用  &&  相连的判定语句中,只要有一个条件的真值为false,则整个式子的值就是false。

而在多个使用  ||  相连的判定语句中,只要有一个条件的真值为true,则整个式子的值就是true。

如果式子中同时出现  &&  运算和  ||  运算,则优先计算  &&  的结果。

在使用 !的式子中,如果式子为true,则取反,即整体输出为false。

案例

比如,我们需要判断一个数字是否在1和10之间,那么就需要用到下面的式子:

var a = 6
var b = a > 1 && a < 10
alert(b)

那么,输出的值是多少呢?

显然,a同时满足大于1和小于10两个条件,因此输出的值应当是true。

运算符的优先级

在使用运算符计算时,显然存在计算的先后顺序,即存在运算符之间的优先级。 

优先级自上而下排列为:

优先级运算符注释
1()小括号
2++  -- 自增运算符
3*  /  +  -算数运算符
4>  >=  <  <=大小比较运算符
5==  !=  ===  !==值、类型/值比较运算符
6&&逻辑与
7||逻辑或
8!逻辑非
9=赋值
10,逗号

分支语句

if-else语句

该语句的中文释义为如果……就……否则,用于判断是否满足某种条件,并执行相应条件下的代码。

该语句的标准代码格式如下:

if (判断条件1) {执行语句1
} else if (判断条件n) {执行语句n
} else {不满足上述条件时才执行的代码
}

如果只需要判定一个条件是否满足,则不需要用到 else if 语句。

如果需要判定多个条件执行对应的代码,则可以使用多组else if语句。

案例

比如,我们需要判断一个学生的成绩等级,分为90及以上的、60到89分的和60分以下的三个等级,使用if语句来实现:

var sc = +prompt("请输入分数")if (sc >= 90) {alert("优秀")
}  else if (sc >= 60 && sc < 90) {alert("及格")
} else {alert("不及格")
}

switch语句

如果我们的判断条件为一个一个单独的数值(枚举类型),而不是一段一段的区间,则可以使用switch语句来操作。

该语句的标准代码如下:

switch(参数值) {case 参数值1:执行语句1breakcase 参数值n:执行语句nbreakdefault:所有条件都不符合时执行的语句
}

如果参数值较少,则使用if语句会更加方便。 

break的作用是结束当前的执行语句,否则程序会一直执行,直到下一个break语句或者default。

案例

输入年份和月份,输出这个月有多少天。 

分析:首先,我们需要获取月份,输出这个月对应的天数;

但是,2月是比较特殊的,所以获取的年份信息需要在月份为2月时提供闰年的判定。

JS代码如下:

var year = +prompt("请输入年份");
var month = +prompt("请输入月份")
switch (month) {case 1,3,5,7,8,10,12:alert(year + "年的" + month + "月有31天");break;case 4,6,9,11:alert(year + "年的" + month + "月有30天");break;case 2:if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {alert(year + "年的" + month + "月有29天");} else {alert(year + "年的" + month + "月有28天");}break;default:alert("输入错误");break;
}

三元表达式

如果只有两种情况,除了使用if语句之外,还有一种更加简洁的方式——三元运算符表达式

标准的三元运算符表达式如下:

判断条件 ? 条件为真执行的语句 : 条件为假执行的语句

案例

比如,如果想要输出两个数的最大值,可以使用下面的代码:

var a = 3, b = 5
let c = a > b ? a : b

结束语

本期的内容到这里就结束了,主要是js的运算符、分支语句和表达式等内容。在后续的本系列博客中,我会继续更新js的基础语法知识,并适当地配合上一些案例。

在全栈领域,博主也只不过是一个普通的萌新而已。本系列的博客主要是记录一下自己学习的一些经历,然后把自己领悟到的一些东西总结一下,分享给大家。

文章全篇的操作过程都是笔者亲自操作完成的,一些定义性的文字加入了笔者自己的很多理解在里面,所以仅供参考。如果有说的不对的地方,还请谅解。

==期待与你在下一期博客中再次相遇==

——还在漏气的【H2O2】

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/448563.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

c++应用网络编程之十一Linux下的epoll模式基础

一、epoll模式 在前面分析了select和poll两种IO多路复用的模式&#xff0c;但总体给人的感觉有一种力不从心的感觉。尤其是刚刚接触底层网络开发的程序员&#xff0c;被很多双十一千万并发&#xff0c;游戏百万并发等等已经给唬的一楞一楞的。一听说只支持一两千个并发&#x…

阿里Dataworks使用循环节点和赋值节点完成对mongodb分表数据同步

背景 需求将MongoDB数据入仓MaxCompute 环境说明 MongoDB 100个Collections&#xff1a;orders_1、orders_2、…、orders_100 前期准备 1、MongoDB数据源配置 需要先保证DW和MongoDB网络是能够联通的&#xff0c;需要现在集成任务中配置MongoDB的数据源信息。 具体可以查…

Python OpenCV精讲系列 - 三维重建深入理解(十七)

&#x1f496;&#x1f496;⚡️⚡️专栏&#xff1a;Python OpenCV精讲⚡️⚡️&#x1f496;&#x1f496; 本专栏聚焦于Python结合OpenCV库进行计算机视觉开发的专业教程。通过系统化的课程设计&#xff0c;从基础概念入手&#xff0c;逐步深入到图像处理、特征检测、物体识…

AD9361 在低至 1MHz 的频率下运行

AD9361 在低至 1MHz 的频率下运行 AD -FREQCVT1-EBZ是包含AD9361的FMCOMMS3/4/5板的附加板。虽然完整的芯片级设计包可在此 RF 收发器的ADI产品页面上找到&#xff0c;但有关此卡的信息及其使用方法、围绕它的设计包以及可使其工作的软件可在此处找到。 AD-FREQCVT1-EBZ 模块…

无人机之放电速率篇

无人机的放电速率是指电池在一定时间内放出其储存电能的能力&#xff0c;这一参数对无人机的飞行时间、性能以及安全性都有重要影响。 一、放电速率的表示方法 放电速率通常用C数来表示。C数越大&#xff0c;表示放电速率越快。例如&#xff0c;一个2C的电池可以在1/2小时内放…

储能电源自动化测试系统中不同硬件电路设计对测试结果有哪些影响?-纳米软件

随着能源领域的不断发展&#xff0c;储能电源在各个领域的应用越来越广泛。为了确保储能电源的性能和可靠性&#xff0c;自动化测试系统的重要性日益凸显。其中&#xff0c;硬件电路设计是自动化测试系统的关键组成部分&#xff0c;不同的硬件电路设计会对测试结果产生不同的影…

程序报错:ModuleNotFoundError: No module named ‘code.utils‘; ‘code‘ is not a package

程序报错内容&#xff1a; Traceback (most recent call last): File "code/nli_inference/veracity_prediction.py", line 10, in <module> from code.utils.data_loader import read_json ModuleNotFoundError: No module named code.utils; code is …

Linux运维_Apache更改默认网站目录

1.首先创建目录 并且在目录下新建测试文件 index.html mkdir -p /home/test/ap_web 直接wget 百度官网 wget www.baidu.com 2.编辑配置文件 /etc/apache2/sites-available/000-default.conf(找到 DocumentRoot)更改为刚刚创建的目录 接着在添加 最终文件: 3.给文件 添加属…

面试题:Redis(五)

1. 面试题 面试问 记录对集合中的数据进行统计 在移动应用中&#xff0c;需要统计每天的新增用户数和第2天的留存用户数&#xff1b; 在电商网站的商品评论中&#xff0c;需要统计评论列表中的最新评论&#xff1b; 在签到打卡中&#xff0c;需要统计一个月内连续打卡的用户数&…

【AI大模型】羊驼大模型详解_零基础入门到精通,看完这篇就足够了~

LLaMa系列模型 羊驼模型&#xff08;鼻祖是LLaMa模型&#xff0c;Facebook公司开源模型&#xff09;&#xff1a;即将成为大模型的安卓&#xff0c;国内95%的大模型都是羊驼套壳。GPT系列&#xff08;OpenAI公司&#xff09;&#xff1a;相当于大模型的iOS&#xff08;不开源&…

鸿蒙OS启动流程

启动流程(基于openharmony4.1) 系统上电加载内核后&#xff0c;按照以下流程完成系统各个服务和应用的启动&#xff1a; 内核加载init进程&#xff0c;一般在bootloader启动内核时通过设置内核的cmdline来指定init的位置。init进程启动后&#xff0c;会挂载tmpfs&#xff0c;…

JavaSE——泛型

目录 一、泛型的引入 二、泛型的好处 三、泛型介绍 四、泛型的语法 (一)泛型的声明 (二)泛型的实例化 五、泛型使用的注意事项和细节 六、泛型练习题1 七、自定义泛型 (一)自定义泛型类 (二)自定义泛型接口 (三)自定义泛型方法 八、泛型练习题2 九、泛型的继承和…

moe2024新生赛--pwn篇

moe2024新生赛–pwn篇 也算是复健吧。。 文章目录 moe2024新生赛--pwn篇**1 二进制漏洞审计入门指北**2 NotEnoughTime3 no_more_gets4 leak_sth5 ez_shellcode6 这是什么&#xff1f;libc7 这是什么&#xff1f;shellcode8 这是什么&#xff1f;random9 flag_helper10 这是什么…

PCB缺陷检测数据集 xml 可转yolo格式 ,共10688张图片

PCB缺陷检测数据集&#xff08;yolov5,v7,v8&#xff09; 数据集总共有两个文件夹&#xff0c;一个是pcb整体标注&#xff0c;一个是pcb部分截图。 整体标注有6个分类&#xff0c;开路&#xff0c;短路等都已经标注&#xff0c;标注格式为xml&#xff0c;每个文件夹下有100多张…

bp intruder 四种攻击类型 记录

1. Sniper 攻击&#xff08;狙击手模式&#xff09; 特点&#xff1a; Sniper 攻击是最基础的一种攻击类型&#xff0c;适用于单参数的简单测试。它会逐一替换每一个 payload 插入点&#xff0c;其他位置保持不变&#xff0c;从而测试单个参数对应用的影响。 工作流程&#…

Java-IO流使用场景

Java IO 流是Java编程中非常重要的组成部分,用于处理文件读写、网络通信等数据传输任务。 1. 字节流 1.1 读取文件 import java.io.FileInputStream; import java.io.IOException;public class ReadFileExample {public static void main(String[] args) {try (FileInputSt…

不用搭建服务?MemFire Cloud让开发更简单

不用搭建服务&#xff1f;MemFire Cloud让开发更简单 在当今的开发世界里&#xff0c;想要开发一个功能齐全的应用&#xff0c;往往意味着需要搭建复杂的后端、开发API接口、处理认证授权、管理数据库……这些琐碎的工作让很多开发者头疼不已&#xff0c;尤其是独立开发者或者…

成都睿明智科技有限公司电商服务可靠不?

在这个短视频风起云涌的时代&#xff0c;抖音不仅成为了人们娱乐消遣的首选平台&#xff0c;更是众多商家竞相追逐的电商新蓝海。成都睿明智科技有限公司&#xff0c;作为抖音电商服务领域的佼佼者&#xff0c;正以其独到的洞察力和专业的服务&#xff0c;助力无数品牌在这片沃…

【进阶OpenCV】 (16)-- 人脸识别 -- FisherFaces算法

文章目录 FisherFaces算法一、算法原理二、算法优势与局限三、算法实现1. 图像预处理2. 创建FisherFace人脸特征识别器3. 训练模型4. 测试图像 总结 FisherFaces算法 PCA方法是EigenFaces人脸识别的核心&#xff0c;但是其具有明显的缺点&#xff0c;在操作过程中会损失许多人…

程序员如何使用AI工具进行设计开发?

一、需求分析阶段 自然语言处理辅助理解需求&#xff1a; 使用自然语言处理工具&#xff0c;如 ChatGPT 等&#xff0c;将复杂的业务需求描述转化为更清晰的技术要求。例如&#xff0c;向 AI 解释项目的背景和目标&#xff0c;让它帮助梳理关键需求点和可能的技术挑战。通过与…