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

在 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.mzph.cn/news/681941.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

爬虫——ajax和selenuim总结

为什么要写这个博客呢,这个代码前面其实都有,就是结束了。明天搞个qq登录,这个就结束了。 当然也会更新小说爬取,和百度翻译,百度小姐姐的爬取,的对比爬取。总结嘛!!!加…

第七篇:SQL语法-DML-数据操作语言

DML英文全称是Data Manipulation Language(数据操作语言),用来对数据库中表的数据记录进行增删改操作。它主要包含以下操作, 添加数据(INSERT)修改数据(UPDATE)删除数据(DELETE) 一,添加数据(INSERT) 注意: 插入数据时&#xff0c…

解析基于检索排序的知识图谱问答系统

目录 前言1 问句的表示与语义理解1.1 问句表示的重要性1.2 端到端网络的优势 2 知识图谱中的排序问题2.1 知识图谱的核心作用2.2 查询匹配的转化与排序问题2.3 实体链接的关键性2.4 路径的构建与系统优化 3 难点与挑战3.1 实体链接、命名实体识别和消歧3.2 排序模型的挑战 4 优…

【C++】模版初阶

目录 泛函编程 函数模版 概念 格式 原理 实例化 模版函数的匹配原则 类模板 定义格式 泛函编程 如何实现一个通用的交换函数呢? void Swap(int& left, int& right) {int temp left;left right;right temp; } void Swap(double& left, dou…

Java中锁的应用

文章目录 前言一、场景描述二、加锁1.synchronized2.ReentrantLock 三、扩展1.ThreadLocal 总结 前言 在多线程场景下,多个线程同时对共享变量进行操作是存在风险的,这时候就需要加锁来保证数据的正确性。 一、场景描述 我这里有5个无人机,准备卖到乌克…

去除vue自带的边距

使用vue时发现总有去不掉的外边距&#xff0c;在index.vue里面怎样设置样式都不管用 查阅资料后发现要在vue项目自带的index.html文件内添加下面的样式代码才行 <style>*{margin: 0;padding: 0;}body,html{margin: 0;padding: 0;} </style>

代码随想录算法训练营day50 || 57. 爬楼梯,322. 零钱兑换,279.完全平方数

讲解链接&#xff1a; 代码随想录 动态规划之完全背包&#xff0c;装满背包最少的物品件数是多少&#xff1f;| LeetCode&#xff1a;322.零钱兑换_哔哩哔哩_bilibili 动态规划之完全背包&#xff0c;换汤不换药&#xff01;| LeetCode&#xff1a;279.完全平方数_哔哩哔哩_bil…

多表查询

目录 统计出一张数据表中的数据量 查询 dept 表中的数据量 查询 emp 表中的数据量 实现 emp 与 dept 的多表查询 笛卡尔积 消除笛卡尔积 把数据表 emp 的别名定为 e&#xff0c;数据表 dept 的别名定为 d&#xff0c;然后在查询中分别使用 e 和 d 代替这两个表 Oracle从…

【MATLAB】PSO_BP神经网络回归预测(多输入多输出)算法原理

有意向获取代码&#xff0c;请转文末观看代码获取方式~也可转原文链接获取~ 1 基本定义 PSO-BP神经网络回归预测&#xff08;多输入多输出&#xff09;算法是一种结合粒子群优化算法&#xff08;PSO&#xff09;和反向传播&#xff08;BP&#xff09;神经网络的混合算法。该算…

在小区门口开什么店比较好?把握商机从这里开始

作为一位资深的鲜奶吧创业者&#xff0c;我已经在这个行业摸爬滚打了五年。这五年的时间里&#xff0c;我见证了社区商业的繁荣与变迁&#xff0c;也深刻体会到了在小区门口开店的商机与挑战。今天&#xff0c;我想和大家分享一些关于在小区门口开店的见解&#xff0c;特别是针…

js中正则表达式的详解(应用场景)

文章目录 一、是什么二、匹配规则正则表达式标记贪婪模式懒惰模式分组 三、匹配方法str.match(regexp)str.matchAll(regexp)str.search(regexp)str.replace(regexp)str.split(regexp)regexp.exec(str)regexp.test(str) 四、应用场景参考文献 一、是什么 正则表达式是一种用来匹…

Android 9.0 任务栏中清除掉播放器的进程,状态栏仍有音乐播放器状态问题的解决

1.概述 在9.0的rom定制化开发中,在点击系统自带的播放器以后,播放音乐的时候,在最近任务栏recents列表中,点击全部清除,发现音乐播放器还在播放音乐,导致出现bug,完整的 解决方法,肯定是需要点击全部清除以后,音乐播放器也被杀掉进程,接下来分析下这个移除任务栏流程…

rtt设备io框架面向对象学习-adc设备

目录 1.adc设备基类2.adc设备基类的子类3.初始化/构造流程3.1设备驱动层3.2 设备驱动框架层3.3 设备io管理层 4.总结5.使用 1.adc设备基类 此层处于设备驱动框架层。也是抽象类。 在/ components / drivers / include / drivers 下的adc.h定义了如下adc设备基类 struct rt_ad…

寒假作业-day11

1>编程实现二维数组的杨辉三角 2>编程实现二维数组计算每一行的和以及列和 3>编程实现二维数计算第二大值 代码&#xff1a; #include<stdio.h> #include<stdlib.h> #include<string.h>void yanghui(int n){int arr[n][n];for (int i 0; i <…

从零开始实现消息队列(一)

从零开始实现消息队列 .什么是消息队列需求分析核心概念模型 . 什么是消息队列 相信大家都了解过阻塞队列和生产者消费者模型,而阻塞队列最大的用途,就是用于实现生产者消费者模型,生产者消费者模型有以下好处: 解耦合 解释: 当主机A给主机B发消息时,A给B发送请求,B给A返回响应…

app逆向-⽹络请求库Retrofit2

文章目录 一、前言二、POST应用三、GET应用 一、前言 Retrofit2 是基于 OkHttp 构建的 RESTful HTTP 客户端&#xff0c;专门用于简化 HTTP 请求的过程&#xff0c;尤其是用于访问 RESTful API。 Retrofit2 提供了一个声明式的方式来定义 REST API 接口&#xff0c;通过注解来…

【NLP 自然语言处理(一)---词向量】

文章目录 什么是NLP自然语言处理发展历程自然语言处理模型模型能识别单词的方法词向量分词 一个向量vector表示一个词词向量的表示-one-hot多维词嵌入word embeding词向量的训练方法 CBOW Skip-gram词嵌入的理论依据 一个vector&#xff08;向量&#xff09;表示短语或者文章ve…

P1990 覆盖墙壁题解

题目 有一个长为N宽为2的墙壁&#xff0c;给你两种砖头&#xff1a;一个长2宽1&#xff0c;另一个是L型覆盖3个单元的砖头。如下图&#xff1a; 0 0 0 00砖头可以旋转&#xff0c;两种砖头可以无限制提供。你的任务是计算用这两种来覆盖N2的墙壁的覆盖方法。例如一个23的墙…

13种2023年智能算法进行PK,免费获取matlab代码

本期推出13种2023年智能算法进行PK&#xff0c;在CEC2005和CEC2022函数集进行测试。文末有代码获取方式。 13种算法都是2023年提出的&#xff0c;分别为&#xff1a; 淘金优化器(GRO)&#xff0c;雪消融优化器(SAO)&#xff0c;霜冰优化算法(RIME)&#xff0c;减法优化器(SABO)…

C++-添加Com类-从 ActiveX 控件添加类-从类型库添加类向导

文章目录 1.从类型库添加类向导2.从 ActiveX 控件添加类3.总结1.从类型库添加类向导 在Visual Studio等开发环境中,从类型库添加类向导是一个用于自动生成接口实现代码的功能。它可以帮助开发者根据COM(Component Object Model)类型库中的接口定义生成对应的类,极大地提高…