短路运算符

319 阅读2分钟
||

如果逻辑或运算符左边的值布尔转换后为false,那么返回右边的值(不管右边的值是真还是假)

如果逻辑或运算符左边的值布尔转换后为true,那么返回左边的值,如果两个操作数都是是null(NaN/undefined),返回null(NaN/undefined)

console.log( true || true ); // true
console.log( 123 || '中国'); // 123
console.log( false || true ); // true
console.log( true || false); // true
console.log(1 || 0); // 1
console.log(undefined || 0); // 0 
console.log(null || 1); // 1
console.log('' || 1); // 1
console.log(0 || 1);
&&

如果逻辑与运算符左边的值布尔转换后为true,那么返回右边的值(不管右边的值是真还是假)

如果逻辑与运算符左边的值布尔转换后为false,那么返回左边的值,但是当逻辑与的左边为 null/NaN/undefined ,结果就会得到null/NaN/undefined。

console.log( true && true ); // true
console.log( 123 && '中国'); // 中国
console.log( false && true ); // false
console.log( true && false); // false
console.log(1 && 0); // 0
console.log( undefined && 0); // undefined 
console.log(null && 1); // null
console.log('' || 1); // ''

??
null ?? 'huli' // huli
undefined ?? 'huli'  // huli
'' ?? 'huli' // ''
[] ?? 'huli' // []
({}) ?? 'huli'  // {}
NaN ?? 'huli' // NaN
false ?? 'huli' // false
0 ?? 'huli'  // 0
当左侧的操作数为 null 或者 undefined 时,返回其右侧操作数,否则返回左侧操作数。
??=
const a = { duration: 50 };

a.duration ??= 10;
console.log(a.duration);
// expected output: 50

a.speed ??= 25;
console.log(a.speed);
// expected output: 25
逻辑空赋值运算符 (x ??= y) 仅在 x 是 nullish (nullundefined) 时对其赋值
||=
const a = { duration: 50, title: '' };

a.duration ||= 10;
console.log(a.duration);
// expected output: 50

a.title ||= 'title is empty.';
console.log(a.title);
// expected output: "title is empty"
有则返回,没有则赋值
&&=
let a = 1;
let b = 0;

a &&= 2;
console.log(a);
// expected output: 2

b &&= 2;
console.log(b);
// expected output: 0
存在则赋值
.?

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

const adventurer = {
  name: 'Alice',
  cat: {
    name: 'Dinah'
  }
};

const dogName = adventurer.dog?.name;
console.log(dogName);
// expected output: undefined

console.log(adventurer.someNonExistentMethod?.());
// expected output: undefined
!

!可将变量转换成boolean类型,null、undefined和空字符串取反都为true,其余都为false。

!''=true
!0=true
!null=true
!undefined=true
!!

一个!是将对象转为布尔型并取反,两个!是将取反后的布尔值再取反,相当于直接将非布尔类型值转为布尔类型值。对于null、undefined、0、''都会被转为flase.

console.log(!!undefined)//false  null、undefined会转换成false。
console.log(!!null)//false 
console.log(!!0)//false  数字类型,会将0转换成false,其余为true。
console.log(!!"")//fase  字符串类型值,会将空值("")转换成false,其余转换成true。
~~

双飞运算符

console.log(~~4.3) // 4