- Javascript 基础教程
- Javascript - 首页
- JavaScript - 路线图
- JavaScript - 概述
- JavaScript - 特性
- JavaScript - 启用
- JavaScript - 放置
- JavaScript - 语法
- JavaScript - Hello World
- JavaScript - Console.log()
- JavaScript - 注释
- JavaScript - 变量
- JavaScript - let 语句
- JavaScript - 常量
- JavaScript - 数据类型
- JavaScript - 类型转换
- JavaScript - 严格模式
- JavaScript - 保留关键字
- JavaScript 运算符
- JavaScript - 运算符
- JavaScript - 算术运算符
- JavaScript - 比较运算符
- JavaScript - 逻辑运算符
- JavaScript - 按位运算符
- JavaScript - 赋值运算符
- JavaScript - 条件运算符
- JavaScript - typeof 运算符
- JavaScript - 空值合并运算符
- JavaScript - 删除运算符
- JavaScript - 逗号运算符
- JavaScript - 分组运算符
- JavaScript - Yield 运算符
- JavaScript - 展开运算符
- JavaScript - 幂运算符
- JavaScript - 运算符优先级
- JavaScript 控制流
- JavaScript - If...Else
- JavaScript - While 循环
- JavaScript - For 循环
- JavaScript - For...in
- Javascript - For...of
- JavaScript - 循环控制
- JavaScript - Break 语句
- JavaScript - Continue 语句
- JavaScript - Switch Case
- JavaScript - 用户定义迭代器
- JavaScript 函数
- JavaScript - 函数
- JavaScript - 函数表达式
- JavaScript - 函数参数
- JavaScript - 默认参数
- JavaScript - Function() 构造函数
- JavaScript - 函数提升
- JavaScript - 自执行函数
- JavaScript - 箭头函数
- JavaScript - 函数调用
- JavaScript - Function call()
- JavaScript - Function apply()
- JavaScript - Function bind()
- JavaScript - 闭包
- JavaScript - 变量作用域
- JavaScript - 全局变量
- JavaScript - 智能函数参数
- JavaScript 对象
- JavaScript - Number
- JavaScript - Boolean
- JavaScript - Strings
- JavaScript - Arrays
- JavaScript - Date
- JavaScript - DataView
- JavaScript - Handler
- JavaScript - Math
- JavaScript - RegExp
- JavaScript - Symbol
- JavaScript - Sets
- JavaScript - WeakSet
- JavaScript - Maps
- JavaScript - WeakMap
- JavaScript - 可迭代对象
- JavaScript - Reflect
- JavaScript - TypedArray
- JavaScript - 模板字面量
- JavaScript - 带标签的模板
- 面向对象 JavaScript
- JavaScript - 对象
- JavaScript - 类
- JavaScript - 对象属性
- JavaScript - 对象方法
- JavaScript - 静态方法
- JavaScript - 显示对象
- JavaScript - 对象访问器
- JavaScript - 对象构造函数
- JavaScript - 原生原型
- JavaScript - ES5 对象方法
- JavaScript - 封装
- JavaScript - 继承
- JavaScript - 抽象
- JavaScript - 多态
- JavaScript - 解构赋值
- JavaScript - 对象解构
- JavaScript - 数组解构
- JavaScript - 嵌套解构
- JavaScript - 可选链
- JavaScript - 全局对象
- JavaScript - Mixins
- JavaScript - 代理
- JavaScript 版本
- JavaScript - 历史
- JavaScript - 版本
- JavaScript - ES5
- JavaScript - ES6
- ECMAScript 2016
- ECMAScript 2017
- ECMAScript 2018
- ECMAScript 2019
- ECMAScript 2020
- ECMAScript 2021
- ECMAScript 2022
- JavaScript 异步
- JavaScript - 异步
- JavaScript - 回调函数
- JavaScript - Promise
- JavaScript - Async/Await
- JavaScript - 微任务
- JavaScript - Promise 化
- JavaScript - Promise 链式调用
- JavaScript - 定时事件
- JavaScript - setTimeout()
- JavaScript - setInterval()
- JavaScript Cookie
- JavaScript - Cookie
- JavaScript - Cookie 属性
- JavaScript - 删除 Cookie
- JavaScript 浏览器 BOM
- JavaScript - 浏览器对象模型
- JavaScript - Window 对象
- JavaScript - Document 对象
- JavaScript - Screen 对象
- JavaScript - History 对象
- JavaScript - Navigator 对象
- JavaScript - Location 对象
- JavaScript - Console 对象
- JavaScript Web API
- JavaScript - Web API
- JavaScript - History API
- JavaScript - Storage API
- JavaScript - Forms API
- JavaScript - Worker API
- JavaScript - Fetch API
- JavaScript - Geolocation API
- JavaScript 事件
- JavaScript - 事件
- JavaScript - DOM 事件
- JavaScript - addEventListener()
- JavaScript - 鼠标事件
- JavaScript - 键盘事件
- JavaScript - 表单事件
- JavaScript - 窗口/文档事件
- JavaScript - 事件委托
- JavaScript - 事件冒泡
- JavaScript - 事件捕获
- JavaScript - 自定义事件
- JavaScript 错误处理
- JavaScript - 错误处理
- JavaScript - try...catch
- JavaScript - 调试
- JavaScript - 自定义错误
- JavaScript - 扩展错误
- JavaScript 重要关键字
- JavaScript - this 关键字
- JavaScript - void 关键字
- JavaScript - new 关键字
- JavaScript - var 关键字
- JavaScript HTML DOM
- JavaScript - HTML DOM
- JavaScript - DOM 方法和属性
- JavaScript - DOM 文档
- JavaScript - DOM 元素
- JavaScript - DOM 属性 (Attr)
- JavaScript - DOM 表单
- JavaScript - 更改 HTML
- JavaScript - 更改 CSS
- JavaScript - DOM 动画
- JavaScript - DOM 导航
- JavaScript - DOM 集合
- JavaScript - DOM NodeList
- JavaScript - DOM DOMTokenList
- JavaScript 杂项
- JavaScript - Ajax
- JavaScript - 异步迭代
- JavaScript - Atomics 对象
- JavaScript - Rest 参数
- JavaScript - 页面重定向
- JavaScript - 对话框
- JavaScript - 页面打印
- JavaScript - 验证
- JavaScript - 动画
- JavaScript - 多媒体
- JavaScript - 图像地图
- JavaScript - 浏览器
- JavaScript - JSON
- JavaScript - 多行字符串
- JavaScript - 日期格式
- JavaScript - 获取日期方法
- JavaScript - 设置日期方法
- JavaScript - 模块
- JavaScript - 动态导入
- JavaScript - BigInt
- JavaScript - Blob
- JavaScript - Unicode
- JavaScript - 浅拷贝
- JavaScript - 调用栈
- JavaScript - 引用类型
- JavaScript - IndexedDB
- JavaScript - Clickjacking 攻击
- JavaScript - 柯里化
- JavaScript - 图形
- JavaScript - Canvas
- JavaScript - 防抖
- JavaScript - 性能
- JavaScript - 样式指南
JavaScript - 算术运算符
JavaScript 算术运算符
JavaScript 中的算术运算符对数值(操作数)执行数学计算。大多数算术运算符是二元运算符,因为它们对两个操作数执行计算。一些算术运算符是一元运算符。一元运算符对单个操作数执行计算。
JavaScript 支持许多算术运算符,例如加法、减法、乘法、除法运算符等。它使用算术运算符的常用符号,例如“+”表示加法,“-”表示减法,“*”表示乘法,“/”表示除法等。
操作数可以是字面量、变量或表达式。
var z = 3 + 5; // 3 and 5 are literal values. const x = 3; y = 5; var z = x + y ; // x and y are variables. var z = 3 + 2*x // expression
通常,算术运算符用于执行数学运算,但它们也可以用于其他运算。例如,加法运算符 (+) 可用于字符串连接。
这里,我们给出了一个包含数学运算符的表格,并解释了每个运算符的功能。
运算符 | 名称 | 描述 |
---|---|---|
+ | 加法 | 将两个操作数相加 |
- | 减法 | 从第一个操作数中减去第二个操作数 |
* | 乘法 | 将两个操作数相乘 |
/ | 除法 | 将分子除以分母 |
% | 模数 | 输出整数除法的余数 |
++ | 增量 | 将整数值增加 1 |
-- | 减量 | 将整数值减少 1 |
让我们借助示例讨论不同的运算符。
JavaScript 加法 (+) 运算符
JavaScript 加法 (+) 运算符将两个数值操作数相加。它由加号 (+) 符号表示。
var x = 5, y = 10; var sum = x + y;
此运算符也可用于连接字符串和/或数字。
var z = '10' + 3 // returns 103 var z = '10' + '3' // returns 103
- 如果一个操作数是字符串,则加法运算符会将另一个操作数转换为字符串,并将其与第一个操作数连接起来。
- 如果两个操作数都是字符串,则它只是将第二个操作数连接到第一个操作数。
- 如果两个操作数都是数值,则它将返回数值。
示例
在下面的示例中,我们演示了添加两个十进制数字以及连接字符串和数字。
<html> <body> <script> const x = 3; y = 5; var z = x + y ; document.write(z +"</br>"); var z = '10' + 3 document.write(z +"</br>"); var z = '10' + '3'; document.write(z +"</br>"); </script> </body> </html>
JavaScript 减法 (-) 运算符
JavaScript 减法 (-) 运算符从左操作数中减去右操作数,并生成它们的差。它由减号 (-) 符号表示。
20 - 10; // returns 10 '20' - 10; // returns 10 '20' - '10'; // returns 10 '20ee' - 10; // returns NaN NaN - 10 // return NaNs Infinity - 10 // returns infinity
- 减法运算符使用数值操作数,但也可用于非数值操作数,例如字符串。
- 如果两个操作数都是数字,则结果是数字。
- 如果任何一个或两个操作数都是字符串(仅包含数字),则它首先将字符串转换为数字,然后执行减法运算。
- 如果字符串包含非数字值,则它将返回 NaN。
- 如果任何操作数为 NaN 或 Infinity,则结果将分别为 NaN 或 Infinity。
示例
在下面的示例中,我们演示了两个十进制数字和其他数据类型的减法。
<html> <body> <script> var x = 20; y = 10; var z = x - y ; document.write(z +"</br>"); x = "20"; y = "10" z = x - y ; document.write(z +"</br>"); x = "20ee"; z = x - y ; document.write(z +"</br>"); </script> <p>Change the values of the variables and test the resultant values</p> </body> </html>
JavaScript 乘法 (*) 运算符
JavaScript 乘法运算符将两个数字(操作数)相乘。它给出两个操作数的乘积。它由星号 (*) 符号表示。如果两个操作数符号相同,则乘积为正。如果两个操作数符号不同,则乘积为负。
如果任何一个或两个操作数是字符串,它会将字符串转换为数字,然后返回它们的乘积。
示例
在下面的示例中,我们演示了在不同类型的操作数上使用乘法运算符。
<html> <body> <script> var x = 20; y = 10; var z = x * y ; document.write(z +"</br>"); x = "20"; y = "10" z = x * y ; document.write(z +"</br>"); x = "20ee"; z = x * y ; document.write(z +"</br>"); </script> <p>Change the values of the variables and test the resultant values</p> </body> </html>
JavaScript 除法 (/) 运算符
JavaScript 除法 (/) 运算符将左操作数(被除数)除以右操作数(除数),并返回商。它由斜杠 (/) 符号表示。
20/10 // returns 2 20/-10 // return -2 100/0 // returns Infinity 0/0 // returns NaN
示例
让我们演示一下除法运算符的使用。
<html> <body> <script> var x = 20; y = 10; var z = x / y ; document.write(z +"</br>"); x = "20"; y = "10" z = x / y ; document.write(z +"</br>"); z = x / 0 ; document.write(z +"</br>"); z = 0 / 0 ; document.write(z +"</br>"); </script> <p>Change the values of the variables and test the resultant values</p> </body> </html>
JavaScript 取模 (%) 运算符
JavaScript 取模 (%) 运算符返回第一个操作数除以第二个操作数的余数。它也被称为余数运算符。它由百分号 (%) 符号表示。它采用被除数的符号。例如,5%3 得到 2,因为当 5 除以 3 时,余数为 2。
示例
让我们借助示例程序了解取模运算符。
<html> <body> <script> var x = 20 % 9; var y = -20 % 9; var z = 20.43 % 9; var a = 20 % -9; var b = 20 % 10; document.write(x +"</br>"); document.write(y +"</br>"); document.write(z +"</br>"); document.write(a +"</br>"); document.write(b +"</br>"); </script> </body> </html>
JavaScript 自增 (++) 运算符
JavaScript 自增 (++) 运算符将操作数的值增加 1。它是一个一元运算符。它只接受一个操作数。它由双加号 (++) 符号表示。
JavaScript 中有两种类型的自增运算符:
前缀自增运算符
前缀自增运算符在使用变量的当前值之前递增变量的值。例如:
var x = 10; var y = ++x; // x is now 11 and y is also 11.
后缀自增运算符
后缀自增运算符在使用变量的当前值之后递增变量的值。例如:
var a = 10; var b = a++; // a is now 11 but b is 10.
这里,在上面代码的第二行中,首先将 a 的当前值赋给 b,然后递增 a 的值。
让我们看看下面的例子:
<html> <body> <script> var x = 10; var y = --x; //prefix decrement var a = 10; var b = a--; // postfix decrement document.write("x = " + x); document.write(" y = " + y + "<br>"); document.write("a = " + a); document.write(" b = " + b + "<br>"); </script> <p>Change the values of the variables and check the results</p> </body> </html>
JavaScript 自减 (--) 运算符
JavaScript 自减 (--) 运算符将操作数的值减少 1。它也是一个一元运算符,即它只接受一个操作数。它由双减号 (--) 符号表示。
JavaScript 中有两种类型的自减运算符:
前缀自减运算符
前缀自减运算符在使用变量的当前值之前递减变量的值。例如:
var x = 10; var y = --x; // x is now 9 and y is also 9.
后缀自减运算符
后缀自减运算符在使用变量的当前值之后递减变量的值。例如:
var a = 10; var b = a--; // a is now 9 but b is 10.
这里,在上面代码的第二行中,首先将 a 的当前值赋给 b,然后递减 a 的值。
让我们看看下面的例子:
<html> <body> <script> var x = 10; var y = --x; //prefix decrement var a = 10; var b = a--; // postfix decrement document.write("x = " + x); document.write(" y = " + y + "<br>"); document.write("a = " + a); document.write(" b = " + b + "<br>"); </script> <p>Change the values of the variables and check the results</p> </body> </html>