0
点赞
收藏
分享

微信扫一扫

JS中? ?和??=和?.和 ||的区别


?.

undefined和null是两个比较特殊的数据类型,是不能用点操作符去访问属性的,否则将会报错

let a;
console.log(a?.name); //undefined
console.log(a.name); //报错

let obj = {};
console.log(obj.name); //undefined
console.log(obj?.name?.a); //undefined
console.log(obj.name.a); //报错

?? 与 || 的区别

A ?? B
A || B

使用 ?? 时,只有A为 null 或者 undefined 时才会返回 B;
使用 || 时,A会先转化为布尔值判断,为true时返回A , false 返回B

// ??
console.log(undefined ?? 2); // 2
console.log(null ?? 2); // 2
console.log(0 ?? 2); // 0
console.log("" ?? 2); // ''
console.log(true ?? 2); // true
console.log(false ?? 2); // false

// ||
console.log(undefined || 2); // 2
console.log(null || 2); // 2
console.log(0 || 2); // 2
console.log("" || 2); // 2
console.log(true || 2); // true
console.log(false || 2); // 2

空值合并操作符 ??

只有当左侧为null 或者undefined 时,才会返回右侧的值

可选链操作符 ?.

?. 允许读取连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。

?. 操作符的功能类似于. 链操作符,不同之处在于,在引用为空,即 null 或者 undefined 的情况下不会引起错误,该表达式短路返回值。

const obj = { a: { b: [{ name: "obj" }] } };

// 原本的写法
console.log(obj && obj.a && obj.a.b.length && obj.a.b[0].name); //obj

// 可选链写法
console.log(obj?.a?.b?.[0]?.name); // obj
console.log(obj?.b?.c?.d); // undefined

**?.可以和 ?? 运算符结合使用 **

const obj = { a: { name: "obj" } };

console.log(obj?.a?.b ?? "hello world"); // hello world

空值赋值运算符(??=)

**当??=左侧的值为null、undefined的时候,才会将右侧变量的值赋值给左侧变量.其他所有值都不会进行赋值

**

let a = "你好";

let b = null;
let c = undefined;
let d = 0;
let e = "";
let f = true;
let g = false;

console.log((b ??= a)); // 你好
console.log((c ??= a)); // 你好
console.log((d ??= a)); // 0
console.log((e ??= a)); // ''
console.log((f ??= a)); // true
console.log((g ??= a)); // false

console.log(b); // 你好
console.log(c); // 你好
console.log(d); // 0
console.log(e); // ''
console.log(f); // true
console.log(g); // false


举报

相关推荐

0 条评论