JS基础:8个算数运算符详解

你好,我是云桃桃。

一个希望帮助更多朋友快速入门 WEB 前端的程序媛。

云桃桃 大专生,一枚程序媛,感谢关注。回复 “前端基础题”,可免费获得前端基础 100 题汇总,回复 “前端基础路线”,可获取完整web基础路线导图。

308篇原创内容-更多前端系列内容可以go公众.h:云桃桃

后台回复“前端基础路线”可获取前端基础学习路线

后台回复“前端基础题”可得到前端基础100题汇总,持续更新中

后台回复“前端电子书”可获取20+本精选电子书

前言

在 JavaScript 中,运算符主要分为以下几种类型:

  1. 算术运算符:用于执行数学运算,如加法(+)、减法(-)、乘法(*)、除法(/)、取模(%),递增(++)和递减(--)等。

  2. 赋值运算符:用于将一个值赋给一个变量,如等于(=)、加等于(+=)、减等于(-=)、乘等于(*=)、除等于(/=)、取模等于(%=)等。

  3. 比较运算符:用于比较两个值的大小关系,如等于(==)、不等于(!=)、大于(>)、小于(<)、大于等于(>=)、小于等于(<=)等。

  4. 逻辑运算符:用于执行逻辑运算,如与(&&)、或(||)、非(!)等。

  5. 位运算符:用于对整数进行位运算,如按位与(&)、按位或(|)、按位异或(^)、左移(<<)、右移(>>)等。

  6. 其他运算符:如条件运算符(?:)、逗号运算符(,)等。

这些运算符在 JavaScript 中具有不同的语法和功能,可以通过它们实现各种复杂的运算和逻辑判断。

我们今天先聊聊算数运算符,也就是数值运算,一共有 8 个,我们一起来看看吧。

加法(+):

var num1 = 5
var num2 = 3

var sum = num1 + num2
// 输出结果:8
console.log(sum)

减法(-):

var num5 = 10
var num6 = 5

var difference = num5 - num6
// 输出结果:5
console.log(difference)

乘法(*):

var num9 = 4
var num10 = 2

var product = num9 * num10
// 输出结果:8
console.log(product)

除法(/):

var num13 = 10
var num14 = 2

var quotient = num13 / num14
// 输出结果:5
console.log(quotient)

取模(%):

它也叫取余,也就是除法的余数。

var num17 = 15
var num18 = 4

var remainder = num17 % num18
// 输出结果:3
console.log(remainder)

指数运算符(**):

指数运算符(**)用于计算幂,即一个数的次方。这个运算符是在 ES6 中引入的,提供了一种更简洁的方式来进行指数运算,使用Math.pow()函数也来可以完成相同的任务。

比如,计算 2 的 3 次方。

var result = 2 ** 3 // 2 的 3 次方等于 8
console.log(result) // 输出: 8

再比如,计算 5 的 2 次方,然后与 2 相乘。

var value = 5 ** 2 * 2 // 5 的 2 次方等于 25,然后乘以 2 得到 50
console.log(value) // 输出: 50

使用指数运算符可以使得代码更加简洁和易于理解,特别是在进行幂运算时。它还支持小数指数,允许进行开方等操作。例如,Math.sqrt(value)可以简写为value ** (1/2)

递加、递减

递增(++)和递减(--)运算符用于快速增加或减少变量的值。递增操作符有两种形式:前缀(++i)和后缀(i++),递减操作符同样也有前缀(--i)和后缀(i--)形式。

我们来一起看一下吧。

递增运算符(++

前缀递增:在变量值增加之后,返回增加后的值。

var a = 2
var b = ++a // a 先增加 1,然后 b 得到 a 的值,即 b = 3
console.log(a) // 输出: 3
console.log(b) // 输出: 3

后缀递增:返回变量当前的值,然后变量值再增加。

var c = 5
var d = c++ // c 先提供其值给 d,然后 c 增加 1
console.log(c) // 输出: 6
console.log(d) // 输出: 5

递减运算符(--

前缀递减:在变量值减少之后,返回减少后的值。

var e = 10
var f = --e // e 先减少 1,然后 f 得到 e 的值,即 f = 9
console.log(e) // 输出: 9
console.log(f) // 输出: 9

后缀递减:返回变量当前的值,然后变量值再减少。

var g = 15
var h = g-- // g 先提供其值给 h,然后 g 减少 1
console.log(g) // 输出: 14
console.log(h) // 输出: 15

我们在使用递增和递减运算符时,要注意它们是前缀还是后缀,因为这会影响运算符的返回值。前缀形式通常用于确保变量的值在表达式中立即更新,而后缀形式则用于在表达式求值之后进行更新。

算数运算符的优先级

那你可能会有这样的疑惑:如果一个语句涉及多个运算符,应该是什么样的顺序呢?

其实,算数运算符的优先级遵循数学中的运算法则,即先乘除后加减,同级运算符从左到右执行。以下是一些常用的算数运算符及其优先级顺序:

  1. 有括号的时候,先计算括号内的。

  2. 指数(** - 表示幂运算。

  3. 乘法(*)、除法(/)、取模(% - 乘除取模运算优先于加减运算。

  4. 加法(+)、减法(- - 加减运算是运算的最低级。

举一些例子吧。

指数运算符(**

var a = 2 ** 3 // a = 8
console.log(a) // 输出: 8

乘法和除法优先于加法和减法

var b = 10 * (3 + 2) // 先计算括号内的加法,再进行乘法
console.log(b) // 输出: 50

var c = 10 + 20 / 4 // 先进行除法,再进行加法
console.log(c) // 输出: 25

加法和减法

var d = 10 + 20 - 5 // 加法和减法从左到右计算
console.log(d) // 输出: 25

需要注意的是,

当表达式包含多个同级别的运算符时,它们会按照从左到右的顺序进行计算。

那,为了确保算数运算按照预期的顺序执行,建议使用括号明确指定优先级,尤其是当涉及到多个不同优先级的运算符时。

var e = (10 + 20) * 4 // 先计算括号内的加法,再进行乘法
console.log(e) // 输出: 120

var f = 10 - (3 + 2) / 4 // 先计算括号内的加法和除法,再进行减法
console.log(f) // 输出: 9

通过使用括号,你可以控制表达式的计算顺序,确保得到正确的结果。这是一种良好的编程实践,可以提高代码的可读性和准确性。

OK,本文完。

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

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

相关文章

嵌入式学习——C语言基础——day14

1. 共用体 1.1 定义 union 共用名 { 数据类型1 成员变量1; 数据类型2 成员变量2; 数据类型3 成员变量3; .. }; 1.2 共用体和结构体的区别 1. 结构体每个成员变量空间独立 2. 共用体每个成员变量空间共享 1.3 判断内存大小端 1. 内存大端…

Ranni: Taming Text-to-Image Diffusion for Accurate Instruction Following

Ranni: Taming Text-to-Image Diffusion for Accurate Instruction Following abstract 我们引入了一个语义面板作为解码文本到图像的中间件&#xff0c;支持生成器更好地遵循指令 Related work 最近的工作还通过包含额外的条件&#xff08;如补全掩码[15&#xff0c;45]、…

天猫商品搜索API返回值说明:关键字搜索如何精准定位商品,精准定位,一键直达!

通过天猫商品搜索API&#xff0c;关键词搜索不再是难题。精准定位&#xff0c;快速找到您心仪的商品&#xff0c;开启便捷购物新时代。掌握API返回值的奥秘&#xff0c;让您的搜索更智能、更高效&#xff01; 天猫商品搜索API&#xff08;如item_search&#xff09;的返回值设计…

xyctf(write up)

ezhttp 因为是一道http的题&#xff0c;前端代码没有什么有效信息&#xff0c;但提示说密码在某个地方&#xff0c;我们用robots建立一个robots.txt文件来看有哪个文件可以访问 补充知识&#xff1a;http请求中via字段表示从哪个网址的服务器代理而来&#xff0c;user-agent表…

纯血鸿蒙APP实战开发——页面间共享组件实例的案例

介绍 本示例提供组件实例在页面间共享的解决方案&#xff1a;通过Stack容器&#xff0c;下层放地图组件&#xff0c;上层放Navigation组件来管理页面&#xff0c;页面可以共享下层的地图组件&#xff0c;页面中需要显示地图的区域设置为透明&#xff0c;并参考触摸交互控制&am…

git使用注意事项事项

以下操作均在gitee平台上实现 文章目录 1、本地仓库和远程仓库有冲突2、git提交自动忽略某些文件3、git无法push提交到远程仓库 1、本地仓库和远程仓库有冲突 在web端修改了文件内容或者删除了文件&#xff0c;本地仓库需要重新把远程仓库拉取到本地&#xff0c;或者强制提交到…

从零开始学RSA: [WUSTCTF2020]情书等5题

1 [WUSTCTF2020]情书 题目 Premise: Enumerate the alphabet by 0、1、2、..... 、25 Using the RSA system Encryption:0156 0821 1616 0041 0140 2130 1616 0793 Public Key:2537 and 13 Private Key:2537 and 937flag: wctf2020{Decryption}解题 前提&#xff1a;用0、…

GreptimeDB 助力国家电网数字换流站打造稳定高效的时序数据底座

电网体系作为现代社会运行的支柱之一&#xff0c;为各行各业、千家万户提供了电能的基本支持。从家庭到企业&#xff0c;医院到学校&#xff0c;交通到通讯&#xff0c;电力电网的应用贯穿始终。近年来&#xff0c;特高压换流站成为国家电网的重点建设工程&#xff0c;“十四五…

YUM源仓库部署和NFS共享存储服务

一.YUM源仓库部署 1.YUM 概述 &#xff08;1&#xff09;是基于RPM软件包构建的软件更新机制 &#xff08;2&#xff09;可以自动解决依赖关系 &#xff08;3&#xff09;所有软件包有集中的YUM软件仓库提供 2.准备YUM源 &#xff08;1&#xff09;软件仓库的提供方式&…

计算机组成结构—高速缓冲存储器(Cache)

目录 一、Cache的基本工作原理 1.Cache工作原理 2.命中率 3.Cache的基本结构 4.Cache的改进 二、Cache和主存之间的映射方式 1.直接映射 2.全相联映射 3.组相联映射 三、Cache中主存块的替换算法 四、Cache的写策略 概为了解决 CPU 和主存之间速度不匹配的问题&#x…

基于springboot+vue+Mysql的点餐平台网站

开发语言&#xff1a;Java框架&#xff1a;springbootJDK版本&#xff1a;JDK1.8服务器&#xff1a;tomcat7数据库&#xff1a;mysql 5.7&#xff08;一定要5.7版本&#xff09;数据库工具&#xff1a;Navicat11开发软件&#xff1a;eclipse/myeclipse/ideaMaven包&#xff1a;…

redis stream 作为消息队列的最详细的命令说明文档

简介 stream 作为消息队列&#xff0c;支持多次消费&#xff0c;重复消费&#xff0c;ack机制&#xff0c;消息异常处理机制。 涉及到以下几个概念&#xff0c;消息流&#xff0c;消费者组&#xff0c;消费者。 涉及到以下命令 # 添加消息到流中 XADD key [NOMKSTREAM] [&…

Al加码,引爆“躺平式”旅游 | 最新快讯

旅游业正迎来新的技术浪潮。 文&#xff5c;锌刻度&#xff0c;作者&#xff5c;孟会缘&#xff0c;编辑&#xff5c;李季 今年的五一&#xff0c;“微度假”“微旅行”纷纷出圈。 相较于三亚、云南等老牌旅游大热门&#xff0c;人们开始寻找一些不用“人挤人”的小众旅行目的…

谁能取代迈巴赫,征服互联网安全大佬周鸿祎?

‍作者 |老缅 编辑 |德新 4月18日&#xff0c;「周鸿祎卖车」登上了微博热搜。这位360创始人、董事长发微博称&#xff1a;自己做了一个艰难的决定&#xff0c;将把陪伴9年的迈巴赫600给卖掉。 随后&#xff0c;他解释道&#xff1a;「这是因为我需要体验新一代车的感觉。古人…

SQL注入——绕过information

衔接上文&#xff0c;进一步对SQL注入less-1进行禁止information的操作&#xff0c;上文连接如下&#xff1a; SQL注入less-1-CSDN博客 一、对less-1进行编辑 增加一段代码&#xff0c;作用是禁止information字段 二、进行检查 可以看到代码已经生效&#xff0c;禁止用infor…

TypeError报错处理

哈喽&#xff0c;大家好&#xff0c;我是木头左&#xff01; 一、Python中的TypeError简介 这个错误通常表示在方法调用时&#xff0c;参数类型不正确&#xff0c;或者在对字符串进行格式化操作时&#xff0c;提供的变量与预期不符。 二、错误的源头&#xff1a;字符串格式化…

调用第三方接口——支付宝付款

沙箱环境是支付宝开放平台为开发者提供的用于接口开发及主要功能联调的模拟环境。 参考 登录 - 支付宝 在沙箱环境下&#xff0c;已经分配好了用于模拟测试的应用信息、商家信息、买家信息等 小程序文档 - 支付宝文档中心 内网穿透&#xff08;支付宝付款需要在公网进行检查…

MybatisPlus也能轻松生成三层架构代码?

&#x1f469;&#x1f3fd;‍&#x1f4bb;个人主页&#xff1a;阿木木AEcru &#x1f525; 系列专栏&#xff1a;《Docker容器化部署系列》 《Java每日面筋》 &#x1f4b9;每一次技术突破&#xff0c;都是对自我能力的挑战和超越。 目录 一、前言三层架构的流程图为什么使用…

为什么需要自动化测试?自动化有哪些优势?

前言 自动化测试&#xff0c;最近些年可谓是大火。招聘上的要求也好&#xff0c;培训班的广告也罢&#xff0c;比比皆是&#xff0c;足以说明它在业内的火爆程度。 虽然说会写自动化测试并不能说明你就很牛批&#xff0c;但是你不会的话&#xff0c;那么很抱歉&#xff0c;你…

保持 Hiti 证卡打印机清洁的重要性和推荐的清洁用品

在证卡印刷业务中&#xff0c;保持印刷设备的清洁至关重要。特别是对于 Hiti 证卡打印机来说&#xff0c;它们是生产高质量证卡的关键工具。保持设备清洁不仅可以保证打印质量和效率&#xff0c;还可以延长其使用寿命。本文将探讨保持 Hiti 证卡打印机清洁卡的重要性&#xff0…