当前位置: 首页 > news >正文

[JavaScript] 运算符详解

文章目录

  • 算术运算符(Arithmetic Operators)
      • 注意事项:
  • 比较运算符(Comparison Operators)
      • 注意事项:
  • 逻辑运算符(Logical Operators)
      • 短路运算:
      • 逻辑运算符的返回值:
  • 赋值运算符(Assignment Operators)
  • 三元运算符(Ternary Operator)
  • 位运算符(Bitwise Operators)
  • 运算符优先级
  • 小练习

算术运算符(Arithmetic Operators)

算术运算符用于完成基本的数学计算。

运算符描述示例结果
+加法5 + 27
-减法5 - 23
*乘法5 * 210
/除法5 / 22.5
%取余(模运算)5 % 21
**指数(幂运算)2 ** 38
++自增(每次加1)let x = 5; x++5,然后变为6
--自减(每次减1)let x = 5; x--5,然后变为4

注意事项:

  • 整数除法:JavaScript中没有整数除法,5 / 2 会得到浮点结果2.5
  • 自增/自减运算符可以分为前置和后置:
    • 前置++x:先加1后返回结果。
    • 后置x++:先返回结果后加1。
let a = 10;
console.log(a++); // 输出 10,先返回后加1
console.log(a);   // 输出 11
console.log(++a); // 输出 12,先加1后返回

比较运算符(Comparison Operators)

比较运算符返回布尔值:truefalse

运算符描述示例结果
==相等(值相等)5 == '5'true
===全等(值和类型都相等)5 === '5'false
!=不相等(值不相等)5 != '5'false
!==不全等(值或类型不相等)5 !== '5'true
>大于5 > 3true
<小于5 < 3false
>=大于等于5 >= 5true
<=小于等于3 <= 5true

注意事项:

  • ==** 与 === 的区别**:
    • == 会进行类型转换,只比较值是否相等。
    • === 不会进行类型转换,要求值和类型都相等。
console.log(5 == '5');  // true,因为字符串'5'被转换成数字5
console.log(5 === '5'); // false,因为类型不同

逻辑运算符(Logical Operators)

逻辑运算符用于布尔值运算,主要包括:

运算符描述示例结果
&&逻辑与(AND)true && falsefalse
``逻辑或(OR)
!逻辑非(NOT)!truefalse

短路运算:

  • &&:遇到false会短路,直接返回false的值。
  • ||:遇到true会短路,直接返回true的值。
let x = 5;
console.log(x > 0 && x < 10); // true,x大于0并且小于10
console.log(x > 0 || x < 3);  // true,x大于0或小于3
console.log(!(x > 0));        // false,x大于0的反向

逻辑运算符的返回值:

  • &&|| 不总是返回布尔值,它们会返回短路时的具体值。
console.log('a' && 'b'); // 'b',因为'a'为真,继续返回后一个值
console.log(null || 'hello'); // 'hello',因为`null`为假,返回`hello`

赋值运算符(Assignment Operators)

赋值运算符用来给变量赋值。

运算符描述示例等价于
=赋值x = 5
+=加后赋值x += 3x = x + 3
-=减后赋值x -= 3x = x - 3
*=乘后赋值x *= 3x = x * 3
/=除后赋值x /= 3x = x / 3
%=取余后赋值x %= 3x = x % 3
**=幂后赋值x **= 2x = x ** 2

三元运算符(Ternary Operator)

三元运算符是一个简单的条件运算符,语法为:条件 ? 表达式1 : 表达式2

let age = 20;
let isAdult = age >= 18 ? '成年人' : '未成年人';
console.log(isAdult);  // 输出:成年人

位运算符(Bitwise Operators)

位运算符操作二进制位,用得较少,但在某些性能优化或算法中很重要。

运算符描述示例
&按位与5 & 3(结果:1
``按位或
^按位异或5 ^ 3(结果:6
~按位取反~5(结果:-6
<<左移5 << 1(结果:10
>>右移5 >> 1(结果:2

运算符优先级

JavaScript中的运算符是有优先级的,高优先级的运算符会优先计算。

优先级运算符说明
1()括号
2++ --自增、自减
3**幂运算
4* / %乘、除、取余
5+ -加、减
6< <= > >=比较
7== != === !==相等、全等等
8&&逻辑与
9`
10=赋值

小练习

可以尝试完成以下练习题:

  1. 使用三元运算符,根据一个数字是否大于0来输出“正数”或“非正数”。
  2. 判断一个字符串是否为空(长度为0),使用||输出默认值。
http://www.lryc.cn/news/523625.html

相关文章:

  • Hooks 使用规则
  • Ubuntu 24.04 LTS 安装 Docker Desktop
  • 智能创造的幕后推手:AIGC浪潮下看AI训练师如何塑造智能未来
  • 从 JIRA 数据到可视化洞察:使用 Python 创建自定义图表
  • 【网络原理】万字详解 HTTP 协议
  • PHP企业IM客服系统
  • Linux操作系统的灵魂,深度解析MMU内存管理
  • PHP代码审计学习01
  • 《数据思维》之数据可视化_读书笔记
  • 深度学习常见术语解释
  • 重温STM32之环境安装
  • 使用Flask和Pydantic实现参数验证
  • python_在钉钉群@人员发送消息
  • C语言之装甲车库车辆动态监控辅助记录系统
  • 线性代数概述
  • 使用 ChatGPT 生成和改进你的论文
  • Linux命令行工具-使用方法
  • RV1126+FFMPEG推流项目(7)AI音频模块编码流程
  • 四、华为交换机 STP
  • 服务器卡顿是否等同于遭受CC攻击?
  • 【机器学习实战入门】使用Pandas和OpenCV进行颜色检测
  • 一文大白话讲清楚webpack基本使用——1——完成webpack的初步构建
  • RabbitMQ基础篇
  • GPT-5 传言:一场正在幕后发生的 AI 变革
  • CSS布局与响应式
  • C++的auto_ptr智能指针:从诞生到被弃用的历程
  • iOS - Objective-C 底层实现中的哈希表
  • 什么是软件架构
  • 【Golang/nacos】nacos配置的增删查改,以及服务注册的golang实例及分析
  • RabbitMQ集群安装rabbitmq_delayed_message_exchange