小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
脑子好像一直还停留在ES6的时代,手下的代码仿佛更古老,其实不知觉已经来到了ES2021的世界,今天见识一下一些新增的操作符。
逗号运算符 ,
孤陋寡闻的我,不知道逗号竟然也是操作符了。
代码见分晓: 将数组的第一项和第二项调换,并返回两项之和
<script>
function sum(arr) {
return ([arr[0], arr[1]] = [arr[1], arr[0]]), arr[0] + arr[1];
}
const list = [1, 2];
console.log(sum(list));// 返回 3,此时 list 为[2, 1]
</script>
逗号操作符对它的每个操作数求值(从左到右),并返回最后一个操作数的值。
数值分割符 _
ES2021 引入了数值分割符 _
,在数值组之间提供分隔,使一个长数值读起来更容易。Chrome 已经提供了对数值分割符的支持,可以在浏览器里试一试。
let number = 100_0000_0000// 0 太多了不用数值分割符眼睛看花了
console.log(number) // 输出 10000000000
除此之外,十进制的小数部分也可以使用数值分割符,二进制、十六进制里也可以使用数值分割符。
0x11_1 === 0x111 // true 十六进制
0.11_1 === 0.111 // true 十进制的小数
0b11_1 === 0b111 // true 二进制
空值合并运算符 ??
??
是一个逻辑操作符,当左侧的操作数为 null
或者 undefined
时,返回右侧操作数,否则返回左侧操作数。
let num1;
let num2 = 2;
num1 ?? num2
let num1 = 3;
let num2 = 2;
num1 ?? num2
双位运算符 ~~
双否定位操作符的优势在于它执行相同的操作运行速度更快,可以使用双位操作符来替代正数的 Math.floor( )
,替代负数的 Math.ceil( )
。
Math.floor(4.9) === 4; // true
// 双位运算符 ~~
~~4.9 === 4; // true
短路运算符 && 与 ||
短路运算符就是从左到右的运算中前者满足要求,就不再执行后者了。
&&
为取假运算,从左到右依次判断,如果遇到一个假值,就返回假值,以后不再执行,否则返回最后一个真值||
为取真运算,从左到右依次判断,如果遇到一个真值,就返回真值,以后不再执行,否则返回最后一个假值
三元表达式
如果 num2 === 0
为真值则返回 num2
,否则返回 num3
const num = num2 === 0 ? num2 : num3;
赋值运算符简写
-
加法赋值
+=
-
减法赋值
-=
-
乘法赋值
*=
-
除法赋值
/=
-
求幂赋值
**=
-
按位或复制
|=
-
按位与赋值
&=
-
有符号按位右移赋值
>>=
-
无符号按位右移赋值
>>>=
-
逻辑空赋值
??=