条件判断 && 逻辑运算符

条件判断 && 逻辑运算符

前言:本篇文章主要介绍 js基础知识,包括 if 条件表达式、逻辑运算符以及新增的特性空值合并运算符 (??)

1. 条件运算

1.1 if 语句

if(···)语句会计算圆括号内表达式,并将计算结果转换为布尔型。

if(condition === true){
// write excute code in here
}

1.2. else 语句

如果 if 判断条件不成立,则执行 else 语句

if(false){
// 跳过
}else{
// write excute code in here
}

else 总和离其最近的 if 结对

let a=1,b=2
if(a<1){
b = 1
}else if(a>1){
b = 2
}else{
b = 3
}
console.log(b) // 3

1.3. 多个条件 else if()

当具有多个判断条件时执行

if(a){

}else if(b){

}else if(c){

}else{

}

1.4. 条件运算符

如果 condition 为真,则返回 value1,即 result = value1,否则返回 value2

let result = condition ? value1 : value2

用 if 语句改写为

let result
if(condition){
result = value1
}else{
result = value2
}

测试:

let a = 3,b = 5
let num = a > b ? a : b
num // 5

2. 逻辑运算符

逻辑运算符在运行过程中会将每一个操作数转换为 布尔 值

2.1. 逻辑非 

逻辑非 ! 将操作数转换为布尔类型,并返回相反的值。

!true  // false
!false // true

2.2. 逻辑与 &&

只要有一个操作数为假,表达式就停止判断,并返回第一个假值。否则返回最后一个真值。

console.log(true && false)   // false
console.log(false && true) // false
console.log(true && true) // true

console.log(1 && 0) // 0
console.log(1 && 2) // 2
console.log(0 && 1) // 0

2.3. 逻辑或 ||

只要有一个操作数为真,表达式就停止判断,并返回第一个真值。否则返回最后一个假值。

console.log(true && false)    // true
console.log(false && true) // true
console.log(false && false) // false
运算:表达式为真时返回第一个真值,表达式为假时返回最会一个假值。

console.log(1 && 0) // 1
console.log(1 && 2) // 1
console.log(0 && null) // null
console.log([] && 0) // 0

2.4. 空值合并运算符 ??

空值合并运算符返回第一个已定义的值,如果都没有定义,则返回 undefined

a ?? b // 若a已定义,则返回a,否则返回b

测试:

let a,b=5
a ?? b // 5

let c=1,b
c ?? b // 1

let c=1,b=2
c ?? b // 1

let d,e
d ?? e // undefined

2.5 用逻辑 && 重写 ??

let result = (a !== null && a !== undefined) ? a : b

2.6 ?? 与 || 比较

|| 返回第一个真值
?? 返回第一个已定义的值

?? 可以返回 0

问题?
|| 无法区分 0、false、''、null、undefined,当第一个参数为其中之一时,我们只能得到第二个参数值。但有时我们希望只有在参数值为 null/undefined 时使用默认值

let width = 0
alert(width || 100) // 100
alert(width ?? 100) // 0

2.7 优先级

?? 优先级与 || 相同,只比 =、? 高一点

2.8 ?? 禁止与 && 或者 || 一起使用




原文始发于微信公众号(GIS之路):条件判断 && 逻辑运算符

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/234756.html

(0)
小半的头像小半

相关推荐

发表回复

登录后才能评论
极客之音——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!