短路在JavaScript中是如何工作的?

news/2024/11/15 7:24:08/

在 JavaScript 中,理解真实和虚假的值是编写高效简洁代码的基础。结合短路的概念,开发人员可以编写优雅的解决方案来应对常见的编程挑战。

在本实践指南中,我们将探讨真实值和虚假值,并了解 JavaScript 中短路的机制。

您可以从这里获取所有源代码。

(本文内容参考:java567.com)

目录

  • 了解真实和虚假的价值观
  • 什么是 JavaScript 中的短路?
  • 实际使用案例
  • 结论

了解真实和虚假的价值观

在 JavaScript 中,在布尔上下文中计算时,每个值都具有固有的布尔解释。计算结果为 的值被认为是真实的,而评估结果为 的值是虚假的。true``false

让我们来看看一些例子:

// Truthy Values
if ('Hello') {console.log('Truthy!'); // Output: Truthy!
}if (42) {console.log('Truthy!'); // Output: Truthy!
}if (['apple', 'banana']) {console.log('Truthy!'); // Output: Truthy!
}// Falsy Values
if ('') {console.log('Falsy!'); // This code block is not executed
}if (0) {console.log('Falsy!'); // This code block is not executed
}if (null) {console.log('Falsy!'); // This code block is not executed
}

以下是上述代码的细分:

真实价值观

  • 'Hello':JavaScript 中的任何非空字符串都被认为是真实的。在这种情况下,字符串为非空,因此条件的计算结果为 true。'Hello'
  • 42:任何非零数(正数或负数)都被认为是真实的。由于是非零数,因此条件的计算结果为 true。42
  • ['apple', 'banana']:JavaScript 中的数组被认为是真实的,无论其内容如何。由于数组为非空,因此条件的计算结果为 true。['apple', 'banana']

虚假的价值观

''(空字符串):JavaScript 中的空字符串被认为是虚假的。因此,条件的计算结果为 false,并且不会执行 if 语句中的代码块。

0:数字零在 JavaScript 中被认为是假的。因此,条件的计算结果为 false,并且不会执行 if 语句中的代码块。

null:null 值在 JavaScript 中被认为是虚假的。因此,条件的计算结果为 false,并且不会执行 if 语句中的代码块。

在 JavaScript 中,除 、 、 (空字符串)、 和 之外的值被认为是真实的。在 JavaScript 中编写条件语句和逻辑运算时,理解这些真值和假值至关重要。false``0``''``null``undefined``NaN

理解真值和假值至关重要,因为它们在条件语句和逻辑运算中起着重要作用。

什么是 JavaScript 中的短路?

短路是逻辑运算符 (, ) 表现出的一种行为,如果结果可以通过单独计算第一个操作数来确定,则跳过对第二个操作数的计算。&&``||

让我们通过实际示例来检查短路的工作原理:

运算符&&

运算符返回第一个假操作数,如果所有操作数都为真,则返回最后一个真实操作数。&&

const value = 0;
const result = value && 'Truthy Value';
console.log(result); // Output: 0

在此示例中,计算结果为 ,这是一个虚假值。由于第一个操作数是假的,因此表达式短路,结果是 。value``0``0

const value = 'Hello';
const result = value && 'Truthy Value';
console.log(result); // Output: Truthy Value

在这里,计算结果为一个非空字符串,这是真实的。因此,返回第二个操作数,因为它是最后一个真实操作数。value``'Truthy Value'

运算符||

运算符返回第一个真实操作数,如果所有操作数都是假操作数,则返回最后一个假操作数。||

const name = '';
const displayName = name || 'Guest';
console.log(displayName); // Output: Guest

在此示例中,计算结果为空字符串,该字符串是假的。因此,表达式短路,并分配给 。name``'Guest'``displayName

const name = 'Alice';
const displayName = name || 'Guest';
console.log(displayName); // Output: Alice

在这里,计算结果为一个非空字符串,这是真实的。因此,将返回第一个操作数,因为它是遇到的第一个真实操作数。name``'Alice'

实际使用案例

提供默认值

短路通常用于为变量提供默认值。

const options = {};
const limit = options.limit || 10;
console.log(limit); // Output: 10 (default value)

在此示例中,是一个空对象。该代码打算根据属性为其分配一个值。但是,由于未定义(未定义),因此使用逻辑 OR () 运算符。options``limit``options.limit``options.limit``||

逻辑 OR 运算符返回第一个操作数的值(如果为真)。如果第一个操作数是假的(在本例中为 undefined),则返回第二个操作数(在本例中为 )的值,该值充当默认值。options.limit``10

因此,将被分配值,因为是假的(未定义)。limit``10``options.limit

安全访问嵌套属性

短路还可用于安全地访问对象的嵌套属性。

const user = { address: { city: 'New York' } };
const city = user.address && user.address.city;
console.log(city); // Output: New York

在此示例中,是一个对象,其中包含另一个对象,该对象包含该属性。user``address``city

该表达式正在利用短路。它检查是否存在,如果存在,则进一步检查是否存在。user.address && user.address.city``user.address``user.address.city

如果是真实的(如果存在),JavaScript 会继续计算 。如果是虚假的(如果它是未定义或 null),则 JavaScript 会使计算短路,并且不会继续计算。user.address``user.address.city``user.address``user.address.city

这样可以防止未定义或为 null 的潜在。TypeError``user.address

由于在这种情况下存在,因此表达式的计算结果为 ,即 。user.address``user.address.city``'New York'

此技术可确保安全访问嵌套属性,并有助于避免在对象未按预期完全填充或结构化的情况下出现运行时错误。

结论

短路可以大大增强您的开发工作流程。

您可以在项目中练习这些概念,以熟练有效地利用 JavaScript 的短路行为。

(本文内容参考:java567.com)


http://www.ppmy.cn/news/1351838.html

相关文章

UnityShader——02三大主流编程语言

三大主流编程语言 Shader Language Shader language的发展方向是设计出在便携性方面可以与C/JAVA相比的高级语言,“赋予程序员灵活而方便的编程方式”,并“利用图形硬件的并行性,提高算法的效率” Shader language目前主要有 3 种语言&…

【JavaScript】Promise 和异步操作

文章目录 1. 什么是Promise2. 基本用法使用.then()处理成功状态使用.catch()处理失败状态链式调用 3. Promise.all() 和 Promise.race()Promise.all()Promise.race() 4. 异步操作与async/await使用 async/await 5. 总结 在 JavaScript 中, Promise 是一种处理异步操…

【AI写文章】解释 Git 的基本概念和使用方式

Git是一个版本控制系统,它可以追踪文件的变化并记录历史。以下是Git的基本概念和使用方式: 1. 仓库(Repository):Git仓库是用来存储项目的历史记录和文件的地方。可以在本地计算机上创建一个仓库,也可以在…

机器视觉与智能制造:开启工业自动化的新篇章

机器视觉与智能制造的结合,无疑为工业自动化开启了一个全新的篇章。这两者的结合,不仅提高了生产效率,降低了成本,还提升了产品质量,增强了企业的市场竞争力。 一、机器视觉的核心技术 机器视觉是一种模拟人类视觉的…

如何使用idea连通服务器上的Redis(详细版本)

这里我使用的是阿里云的服务器 打开阿里云的安全组,设置端口为6379 在redis.conf文件中,注释bind 127.0.0.1 将protected-mode设置为no,即关闭保护模式 更改服务器中的防火墙,放行6379端口 # 放行端口 firewall-cmd --zo…

linux---内存管理

一 虚拟内存 即使是现代操作系统中,内存依然是计算机中很宝贵的资源,看看你电脑几个T固态硬盘,再看看内存大小就知道了。 为了充分利用和管理系统内存资源,Linux采用虚拟内存管理技术,利用虚拟内存技术让每个进程都有…

MATLAB知识点:randperm函数(★★★★★)将一个数字序列进行随机打乱

​讲解视频:可以在bilibili搜索《MATLAB教程新手入门篇——数学建模清风主讲》。​ MATLAB教程新手入门篇(数学建模清风主讲,适合零基础同学观看)_哔哩哔哩_bilibili 节选自第3章:课后习题讲解中拓展的函数 在讲解第…

Mermaid绘制UML图教程

Mermaid 是一种轻量级的图形描述语言,用于绘制流程图、时序图、甘特图等各种图表。它采用简单的文本语法,使得用户能够快速绘制各种复杂图表,而无需深入学习图形绘制工具。 一、安装Mermaid Mermaid 可以在浏览器中直接使用,也可…