??
(空值合并运算符)和||
(逻辑或运算符)的基本区别
||
运算符:
它的逻辑是只要左边的值为假值(如false
、0
、null
、undefined
、''
(空字符串)等),就会返回右边的值。例如:
const a = false || 'default';
console.log(a); // 输出 'default'
const b = 0 || 'default';
console.log(b); // 输出 'default'
const c = null || 'default';
console.log(c); // 输出 'default'
const d = '' || 'default';
console.log(d); // 输出 'default'
??
运算符:
它主要用于判断左边的值是否为 null
或 undefined
,只有在这种情况下才会返回右边的值。例如:
const a = false?? 'default';
console.log(a); // 输出 false
const b = 0?? 'default';
console.log(b); // 输出 0
const c = null?? 'default';
console.log(c); // 输出 'default'
const d = undefined?? 'default';
console.log(d); // 输出 'default'
const e = ''?? 'default';
console.log(e); // 输出 ''
举例说明:
在u
ser.name = user.name ?? 'Anonymous';
和u
ser.name = user.name || 'Anonymous';
中的具体区别
user.name = user.name?? 'Anonymous';
这行代码的意思是,如果user.name
是null
或者undefined
,那么ser.name
就赋值为Anonymous
;
如果user.name
有其他任何值(包括false
、0
、空字符串等),就把user.name
的值赋给ser.name
。
例如:
const user = { name: false };
let ser = {};
ser.name = user.name?? 'Anonymous';
console.log(ser.name); // 输出 false
user.name = user.name || 'Anonymous';
这行代码表示只要user.name
是假值(false
、0
、null
、undefined
、''
),ser.name
就赋值为Anonymous
。
例如:
const user = { name: false };
let ser = {};
ser.name = user.name || 'Anonymous';
console.log(ser.name); // 输出 'Anonymous'
总结:
1、在实际编程中,如果只想在变量为null
或undefined
时提供一个默认值,使用??
运算符更合适;
2、如果想在变量为假值(包括null
和undefined
以及其他假值)时提供一个默认值,使用||
运算符更合适。