JS中的 && /|| /,,/,. 运算符

前端APP 投稿 76800 0 评论

JS中的 && /|| /,,/,. 运算符

javascript有不少好用的运算符,合理的使用可以大大提高工作效率,以下简单介绍了4种,具体如下:

逻辑与运算()是 AND 布尔操作。只有两个操作数都为  时,才返回,否则返回 。具体描述如表所示:

条件一条件二结果演示
true1true2true2
truefalsefalse
falsetruefalse
false1false2false1

逻辑与是一种短路逻辑,如果左侧表达式为,则直接短路返回结果,不再运算右侧表达式。运算逻辑如下:

  1. 计算第一个操作数(左侧表达式)的值。

  2. 检测第一个操作数的值。如果左侧表达式的值可转换为 (如 、、、、、),那么就会结束运算,直接返回第一个操作数的值。

  3. 如果第一个操作数可以转换为,则计算第二个操作数(右侧表达式)的值。

  4. 返回第二个操作数的值。

实例:

let a = 10
(a > 5 && console.log('哈哈哈'; // 哈哈
等效于:
if(x> 5 {
	console.log('哈哈';
}

逻辑或运算(是布尔 OR 操作。如果两个操作数都为,或者其中一个为,就返回,否则就返回 。具体如图所示:

条件一条件二结果演示
truetruetrue1 || 2 => 1
truefalsetrue1 || 0 => 1
falsetruetrue0 || 2 => 2
false1false2false20 || undefined=> undefined

逻辑或也是一种短路逻辑,如果左侧表达式为,则直接短路返回结果,不再运算右侧表达式。运算逻辑如下:

  1. 计算第一个操作数(左侧表达式)的值。

  2. 检测第一个操作数的值。如果左侧表达式的值可转换为,那么就会结束运算,直接返回第一个操作数的值。

  3. 如果第一个操作数可以转换为,则计算第二个操作数(右侧表达式)的值。

  4. 返回第二个操作数的值。

空值合并运算符( ?? )是一个逻辑操作符,如果左侧的表达式为 或者  时,返回其右侧表达式,否则返回左侧表达式。
下列表格中的true、false 表示除null  undefined 之外任意

条件一条件二结果演示
null11
undefined22
truefalsetrue

可选链操作符( ?. 允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。( ?. 操作符的功能类似于( . 链式操作符,不同之处在于,在引用为空(nullish (null 或者 undefined 的情况下不会引起错误,该表达式短路返回值是 undefined。与函数调用一起使用时,如果给定的函数不存在,则返回 undefined。

const obj={
	name:'张三',
	age:12
}
console.log(obj ?. name; // 张三
console.log(obj ?. xxxxx; // undefined

下表承接上面数据:

条件一条件二结果演示|
obj(存在name张三
obj(不存在xxxxundefined

编程笔记 » JS中的 && /|| /,,/,. 运算符

赞同 (171) or 分享 (0)
游客 发表我的评论   换个身份
取消评论

表情
(0)个小伙伴在吐槽