【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:
        执行语句1
        break
    case 参数值n:
        执行语句n
        break
    default:
        所有条件都不符合时执行的语句
}

如果参数值较少,则使用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】

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

网络变压器在楼宇电梯控制器中的重要作用

Hqst盈盛&#xff08;华强盛&#xff09;电子导读&#xff1a;今天分享的是网络变压器在楼宇电梯控制器中的重要作用... 网络变压器在楼宇电梯控制器中起着至关重要的作用,工程师总结有以下是其主要应用方面&#xff1a; 一、信号隔离与增强 络变压器可以实现信号的隔离&#…

Qt-界面优化选择器的用法(70)

目录 描述 使用 类型选择器 ID 选择器 并集选择器 子控件选择器 伪控制器 描述 QSS 的选择器⽀持以下⼏种 选择器⽰例说明全局选择器*选择所有的 widget.类型选择器 (type selector)QPushButton选择所有的 QPushButton 和其⼦类的控件.类选择器 (class selector).QPus…

【Golang】关于Go语言中的定时器原理与实战应用

✨✨ 欢迎大家来到景天科技苑✨✨ &#x1f388;&#x1f388; 养成好习惯&#xff0c;先赞后看哦~&#x1f388;&#x1f388; &#x1f3c6; 作者简介&#xff1a;景天科技苑 &#x1f3c6;《头衔》&#xff1a;大厂架构师&#xff0c;华为云开发者社区专家博主&#xff0c;…

QRTCN区间预测 | Matlab实现QRTCN时间卷积神经网络分位数回归区间预测

区间预测 | Matlab实现QRTCN时间卷积神经网络分位数回归区间预测 目录 区间预测 | Matlab实现QRTCN时间卷积神经网络分位数回归区间预测预测效果基本介绍模型特性程序设计参考资料预测效果 基本介绍 Matlab实现QRTCN时间卷积神经网络分位数回归区间预测 QRTCN(Quantile Regres…

2.mybatis-plus3.x的使用

官网&#xff1a;简介 | MyBatis-Plushttps://baomidou.com/introduce/ 3.X版本插件使用、 1. 分页插件 配置插件&#xff08;不能用的情况去官网看看最新的&#xff09; Configuration MapperScan("scan.your.mapper.package") public class MybatisPlusConfig …

Django 定义使用模型,并添加数据

教材&#xff1a; Python web企业级项目开发教程&#xff08;黑马程序员&#xff09;第三章 模型 实验步骤&#xff1a; 1.创建项目和应用 前置步骤可看前文&#xff0c;进入到指定文件位置后创建 django-admin startproject mysite python manage.py startapp app01 2.注册…

DBA | 如何将 .bak 的数据库备份文件导入到SQL Server 数据库中?

[ 知识是人生的灯塔&#xff0c;只有不断学习&#xff0c;才能照亮前行的道路 ] 原文链接&#xff1a;DBA | 如何将 .bak 的数据库备份文件导入到SQL Server 数据库中? 如何将&#xff08;.bak&#xff09;的SQL Server 数据库备份文件导入到当前数据库中? Step 1.登录到 Sql…

【专题】智启未来:新质生产力引擎驱动下的智能制造行业革新报告合集PDF分享(附原数据表)

原文链接&#xff1a; https://tecdat.cn/?p37856 在当今全球经济格局深刻变革的大背景下&#xff0c;制造业作为国家经济的基石&#xff0c;正处在高质量发展的关键历史时期。智能决策作为一股崭新的力量&#xff0c;正逐步成为推动制造业数智化转型的强大新动能。众多制造企…

每日OJ题_牛客_对称之美_哈希_C++_Java

目录 牛客_对称之美_哈希 题目解析 C代码 Java代码 牛客_对称之美_哈希 对称之美 (nowcoder.com) 描述&#xff1a; 给出n个字符串&#xff0c;从第1个字符串一直到第n个字符串每个串取一个字母来构成一个新字符串&#xff0c;新字符串的第i个字母只能从第i行的字…

安卓13屏蔽蓝牙匹配对话框 自动匹配 android13屏蔽蓝牙匹配对话框 自动匹配

总纲 android13 rom 开发总纲说明 文章目录 1.前言2.问题分析3.代码分析4.代码修改5.编译6.彩蛋1.前言 设置 蓝牙连接的时候,会有匹配对话框提示。我们来实现自动配对。 2.问题分析 这里我们是通过点击操作来实现功能的,所以我们思路可以是自动点击功能的实现。 3.代码分…

Ubuntu 24.04 在 BPI-F3 上通过 SD 卡安装并从 NVME 运行

github 代码&#xff1a; https://github.com/rcman/BPI-F3 Ubuntu 24.04 现在正在我的 BPI-F3 上运行。很快会为 YouTube 制作一个视频。 这应该适用于任何版本的 Linux&#xff0c;仅在 Ubuntu 24.04 上测试过 入门 下载 Bianbu映像并使用您最喜欢的工具将其映像到微型 SD 卡…

选择排序-求和表达式

概述 选择排序算法复杂度计算&#xff0c;用到了求和表达式。&#xff08;以前学过&#xff0c;现在都忘了&#xff0c;记录一下&#xff09; 理解求和表达式的关键在于逐步拆分和简化。让我们一步一步来详细解释这个求和表达式&#xff1a; 求和表达式 求和表达式 分步求解 …

ESP32C3 开发板在Linux环境下,进行JTAG 调试演示-启明云端乐鑫代理商

JTAG 调试教程 本教程主要演示 esp32c3 开发板在 linux 环境下&#xff0c;通过 vscode 的 esp-idf 插件使用 jtag 调试工具。 esp32c3 不但内置了USB-JTAG&#xff0c;还内置了USB-SERIAL&#xff0c;仅需要一根USB线即可实现下载和调试仿真。 下面演示调试仿真的过程。 创…

系统思考—抓重点

最近与一些中小微企业的老板交流时&#xff0c;深刻感受到大家都陷入了一种忙碌的困境。在资源有限的情况下&#xff0c;到底该抓住什么&#xff1f;这个问题不仅关乎未来的战略&#xff0c;也与预算息息相关。面对复杂多变的市场环境&#xff0c;许多企业尝试了各种方法&#…

rpa批量发送邮件如何通过编辑器编发邮件?

rpa批量发送邮件的技巧&#xff1f;怎么使用rpa邮箱群发助手&#xff1f; 手动发送邮件变得越来越繁琐且效率低下。为了解决这一问题&#xff0c;越来越多的企业开始采用RPA技术来批量发送邮件。AokSend将详细探讨如何通过编辑器来实现rpa批量发送邮件的功能&#xff0c;从而提…

【JVM】—深入理解G1回收器——概念详解

深入理解G1回收器——概念详解 ⭐⭐⭐⭐⭐⭐ Github主页&#x1f449;https://github.com/A-BigTree 笔记链接&#x1f449;https://github.com/A-BigTree/Code_Learning ⭐⭐⭐⭐⭐⭐ 如果可以&#xff0c;麻烦各位看官顺手点个star~&#x1f60a; 文章目录 深入理解G1回收器…

OceanBase 4.x 部署实践:如何从单机扩展至分布式部署

OceanBase 4.x 版本支持2种部署模式&#xff1a;单机部署与分布式部署&#xff0c;同时支持从单机平滑扩展至分布式架构。这样&#xff0c;可以有效解决小型业务向大型业务转型时面临的扩展难题&#xff0c;降低了机器资源的成本。 以下将详述如何通过命令行&#xff0c;实现集…

【JavaScript】LeetCode:71-75

文章目录 71 搜索插入位置72 搜索二维矩阵73 在排序数组中查找元素的第一个和最后一个位置74 搜索旋转排序数组75 寻找旋转排序数组中的最小值 71 搜索插入位置 二分查找在最后一轮比较中&#xff0c;mid所指向的值 > target&#xff0c;right往左收&#xff0c;此时left所指…

容器实战高手课---09 Page Cache:为什么我的容器内存使用量总是在临界点

你好&#xff0c;我是程远。 上一讲&#xff0c;我们讲了Memory Cgroup是如何控制一个容器的内存的。我们已经知道了&#xff0c;如果容器使用的物理内存超过了Memory Cgroup里的memory.limit_in_bytes值&#xff0c;那么容器中的进程会被OOM Killer杀死。 不过在一些容器的使…

MybatisPlus分页Page插件

分页Page插件 首先&#xff0c;要在配置类中注册MyBatisPlus的核心插件&#xff0c;同时添加分页插件。设置分页查询的配置类,interceptor只有拦截作用&#xff0c;功能需要自己添加。这里我们添加上分页查询功能。 import com.baomidou.mybatisplus.annotation.DbType; impo…