JS常⽤运算符操作符,让编码更简洁本⽂整理⼀些 JS 中常⽤的运算符/操作符,其⽬的在于简化代码。
1. ! 逻辑⾮
如果要将⼀个值转为 Boolean 类型,我们常想到 Boolean() 转型函数来实现,其实也可以⽤ ! 逻辑⾮运算符实现!!val // 等价于 Boolean(val)
2.&& 逻辑于
对于以下代码可以⽤ && 逻辑于改写
if (val) {
myFunction()
}
改写后
val && myFunction()
对于赋值语句也可以这样写
val && (a = 1)
3. || 逻辑或
对于 2 中的例⼦,我们也可以⽤逻辑或改写
!val || myFunction()
另外,假如有如下代码
if (val) {
a = val
} else {
a = 'default'
}
改写后
js合并两个数组a = val || 'default'
4.?? 空值合并/空判断
空值合并运算符 , 如果 ?? 前⾯是 null 或 undefined ,取后⾯的默认值
a = val ?? 'default'
应⽤场景:
if(value !== null && value !== undefined && value !== ''){
//...
}
可将上⾯代码优化为:
if((value??'') !== ''){
//...
}
5. ?. null 传导符(或链判断操作符)
在编程中,如果读取对象的内部的某个属性,往往需要判断该对象是否存在,以防⽌报错。
a = (obj && obj.name) || 'default'
以上代码可以使⽤ null 传导符简写
a = obj?.name || 'default'
常见⽤法:
obj?.prop 对象属性
obj?.[expr] 对象属性(数组也可如此使⽤)
func?.(...args) 函数或对象⽅法的调⽤
6. ... 扩展运算符
-
对象的扩展运算符
const { id, ...other } = { id: '001', age: 18, name: 'Tom' }
id // 001
other // { age: 18, name: 'Tom' }
- 数组的扩展运算符
const arr = [1, 2]
[0, ...arr] // [0, 1, 2]
7.三元运算符
a = val ? ifTrue : ifFalse
val 为真,则 a 取值 ifTrue ,否则取值 ifFalse
8.连等赋值操作
这个操作我们也能经常看见,但我⾃⼰并不常⽤
let a,b
a =
b = 1
a // 1
b // 1
以上代码等价于
let a,b
b = 1
a = b
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论