news 2026/5/4 14:07:41

HoRain云--JavaScript运算符:从入门到精通

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
HoRain云--JavaScript运算符:从入门到精通

🎬 HoRain云小助手:个人主页

🔥 个人专栏: 《Linux 系列教程》《c语言教程》

⛺️生活的理想,就是为了理想的生活!


⛳️ 推荐

前些天发现了一个超棒的服务器购买网站,性价比超高,大内存超划算!忍不住分享一下给大家。点击跳转到网站。

专栏介绍

专栏名称

专栏介绍

《C语言》

本专栏主要撰写C干货内容和编程技巧,让大家从底层了解C,把更多的知识由抽象到简单通俗易懂。

《网络协议》

本专栏主要是注重从底层来给大家一步步剖析网络协议的奥秘,一起解密网络协议在运行中协议的基本运行机制!

《docker容器精解篇》

全面深入解析 docker 容器,从基础到进阶,涵盖原理、操作、实践案例,助您精通 docker。

《linux系列》

本专栏主要撰写Linux干货内容,从基础到进阶,知识由抽象到简单通俗易懂,帮你从新手小白到扫地僧。

《python 系列》

本专栏着重撰写Python相关的干货内容与编程技巧,助力大家从底层去认识Python,将更多复杂的知识由抽象转化为简单易懂的内容。

《试题库》

本专栏主要是发布一些考试和练习题库(涵盖软考、HCIE、HRCE、CCNA等)

目录

⛳️ 推荐

专栏介绍

JavaScript 比较运算符与逻辑运算符详解

一、比较运算符

二、逻辑运算符

1. 逻辑与 (&&)

2. 逻辑或 (||)

3. 逻辑非 (!)

4. 真值与假值

三、实际应用

1. 默认值设置

2. 短路求值避免错误

3. 逻辑组合

四、重要提示


JavaScript 比较运算符与逻辑运算符详解

一、比较运算符

比较运算符用于比较两个值,返回布尔值(true 或 false)。主要比较运算符包括:

运算符说明
==等于(松散相等,会进行类型转换)
===严格等于(不进行类型转换)
!=不等于(松散不相等)
!==严格不等于(不进行类型转换)
>大于
<小于
>=大于等于
<=小于等于

注意:在JavaScript中,比较运算符会进行类型转换,这可能导致一些意外结果。例如:

0 == false; // true(0转换为false) '' == false; // true(空字符串转换为false) 1 == '1'; // true(字符串'1'转换为数字1) 1 === '1'; // false(类型不同)

二、逻辑运算符

逻辑运算符用于组合布尔表达式,但JavaScript的逻辑运算符有独特之处:它们返回的是操作数的值,而不仅仅是布尔值。

1. 逻辑与 (&&)

规则:如果第一个操作数为真(truthy),则返回第二个操作数;否则返回第一个操作数(短路)。

特点

示例

console.log(true && 'hello'); // 'hello'(第一个为真,返回第二个) console.log(false && 'hello'); // false(第一个为假,返回第一个) console.log(0 && 'hello'); // 0(0是falsy,返回0) console.log('abc' && 'hello'); // 'hello'('abc'是truthy,返回第二个) console.log(null && 'hello'); // null(null是falsy,返回null)

2. 逻辑或 (||)

规则:如果第一个操作数为真(truthy),则返回第一个操作数;否则返回第二个操作数(短路)。

特点

示例

console.log(true || 'hello'); // true(第一个为真,返回第一个) console.log(false || 'hello'); // 'hello'(第一个为假,返回第二个) console.log(0 || 'hello'); // 'hello'(0是falsy,返回第二个) console.log('abc' || 'hello'); // 'abc'('abc'是truthy,返回第一个) console.log(null || 'hello'); // 'hello'(null是falsy,返回第二个)

3. 逻辑非 (!)

规则:对操作数的布尔值取反。

特点

示例

console.log(!true); // false console.log(!false); // true console.log(!0); // true(0是falsy,取反为true) console.log(!''); // true(空字符串是falsy,取反为true) console.log(!'abc'); // false('abc'是truthy,取反为false)

4. 真值与假值

JavaScript中,除了以下6种值为"假值"(falsy)外,其他值均为"真值"(truthy):

假值说明
false布尔值false
0数字0
''""空字符串
null空值
undefined未定义
NaN非数字值

真值示例1,'hello',true,[1,2],{},new Date()

三、实际应用

1. 默认值设置

function greet(name) { name = name || 'Guest'; // 如果name为falsy,使用默认值'Guest' console.log(`Hello, ${name}!`); } greet(); // 输出: Hello, Guest! greet('Alice'); // 输出: Hello, Alice!

2. 短路求值避免错误

const user = null; console.log(user && user.name); // 输出: null(不会报错,因为短路)

3. 逻辑组合

// 检查用户名和密码是否有效 function validateForm(username, password) { return (username.length > 5) && (password.length >= 8); } console.log(validateForm('user', 'pass123')); // false(用户名长度不足) console.log(validateForm('username', 'password123')); // true

四、重要提示

  1. 类型转换:逻辑运算符会将操作数隐式转换为布尔值,但返回的是原始操作数值,而非布尔值。

  2. 短路求值:这是逻辑运算符的重要特性,可以提高性能并避免潜在错误。

  3. 优先级&&优先级高于||,需要时使用括号明确优先级:

    console.log(true || false && false); // 等同于 true || (false && false) → true console.log((true || false) && false); // 等同于 (true || false) && false → false
  4. 双非运算符!!可以将任意值转换为对应的布尔值:

    console.log(!!0); // false console.log(!!'abc'); // true console.log(!![]); // true

理解这些运算符的特性和行为,可以帮助你编写更简洁、更高效的JavaScript代码。

❤️❤️❤️本人水平有限,如有纰漏,欢迎各位大佬评论批评指正!😄😄😄

💘💘💘如果觉得这篇文对你有帮助的话,也请给个点赞、收藏下吧,非常感谢!👍 👍 👍

🔥🔥🔥Stay Hungry Stay Foolish 道阻且长,行则将至,让我们一起加油吧!🌙🌙🌙

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/5/1 3:05:26

AI印象派艺术工坊助力美育教学?课堂即时艺术化演示案例

AI印象派艺术工坊助力美育教学&#xff1f;课堂即时艺术化演示案例 1. 技术背景与教育场景需求 在当代美育教学中&#xff0c;如何让学生直观理解不同艺术流派的视觉特征&#xff0c;一直是教学设计中的难点。传统方式依赖静态作品展示&#xff0c;缺乏互动性与生成体验。随着…

作者头像 李华
网站建设 2026/4/30 18:37:34

PX4无人机飞控系统实战完整指南:从环境搭建到首飞成功

PX4无人机飞控系统实战完整指南&#xff1a;从环境搭建到首飞成功 【免费下载链接】PX4-Autopilot PX4 Autopilot Software 项目地址: https://gitcode.com/gh_mirrors/px/PX4-Autopilot 想要快速掌握无人机自主飞行的核心技术吗&#xff1f;这份完整的PX4无人机飞控系统…

作者头像 李华
网站建设 2026/5/1 9:15:23

AI手势识别+彩虹骨骼可视化:开发者入门必看实操手册

AI手势识别彩虹骨骼可视化&#xff1a;开发者入门必看实操手册 1. 引言 1.1 人机交互的新入口&#xff1a;AI手势识别 在智能硬件、虚拟现实&#xff08;VR&#xff09;、增强现实&#xff08;AR&#xff09;和人机交互系统中&#xff0c;手势识别正成为一种自然、直观的输入…

作者头像 李华
网站建设 2026/5/1 8:43:36

FST ITN-ZH与大数据平台集成:Hadoop/Spark处理流程

FST ITN-ZH与大数据平台集成&#xff1a;Hadoop/Spark处理流程 1. 引言 随着语音识别、自然语言处理等AI技术的广泛应用&#xff0c;原始文本中常包含大量非标准化表达&#xff0c;如“二零零八年八月八日”、“一百二十三”等。这些表达在下游任务&#xff08;如信息抽取、数…

作者头像 李华