什么是位运算
1.逻辑位运算符
js中的位运算符
运算符 | 描述 | 例子 | 等同于 | 结果 | 十进制 |
---|---|---|---|---|---|
& | 与 | 5 & 1 | 0101 & 0001 | 0001 | 1 |
| | 或 | 5 | 1 | 0101 | 0001 | 0101 | 5 |
~ | 非 | ~ 5 | ~0101 | 1010 | 10 |
^ | 异或 | 5 ^ 1 | 0101 ^ 0001 | 0100 | 4 |
<< | 零填充左位移 | 5 << 1 | 0101 << 1 | 1010 | 10 |
>> | 有符号右位移 | 5 >> 1 | 0101 >> 1 | 0010 | 2 |
>>> | 零填充右位移 | 5 >>> 1 | 0101 >>> 1 | 0010 | 2 |
js中的其他运算符
1、(param ? res1 : res2)三元运算符
三元运算符,又叫条件运算符
接受三个运算数:条件 ? 条件为真时要执行的表达式 : 条件为假时要执行的表达式
基本示例:
function isChecked(checked) {
return checked ? '是' : '否'
}
console.log(isChecked(true)) // => 是
console.log(isChecked(false)) // => 否
三元运算符用于变量赋值
let time = 0
let have = (time > 23) ? '睡觉' : '工作'
console.log(have) // => '工作'
三元运算符用于空赋值的行为
let x = 1
let x = (x !== null || x !== undefined) ? x : 2
console.log(x) // => 1
用在函数中
function getValue(x, y) {
return (x == null || x == undefined) ? y : x
}
getValue(null, 8) // => 8
getValue(4, 8) // => 4
2、?? 非空运算符
如果第一个参数不是 null/undefined(译者注:这里只有两个假值,但是 JS 中假值包含:未定义 undefined、空对象 null、数值 0、空数字 NaN、布尔 false,空字符串’’),将返回第一个参数,否则返回第二个参数。
基本示例:
null ?? 5 // => 5
3 ?? 5 // => 3
开发业务场景优化:
某些时候,数值为0或者为空字符串””,不应该舍弃0和空字符串””
// 优化前
let prev = 1
let current = 0
let noAccount = null
let future = false
function test(param) {
return param || `不存在`
}
console.log(test(prev)) // => 1
console.log(test(current)) // => 不存在
console.log(test(noAccount)) // => 不存在
console.log(test(future)) // => 不存在
// 优化后
let prev = 1
let current = 0
let noAccount = null
let future = false
function test(param) {
return param ?? `不存在`
}
console.log(test(prev)) // => 1
console.log(test(current)) // => 0
console.log(test(noAccount)) // => 不存在
console.log(test(future)) // => false
概括地说 ?? 运算符允许我们在忽略错误值(如 0 和空字符串、false)的同时指定默认值。
3、??= 空赋值运算符
与非空运算符相关
let x = null
let y = 5
console.log(x ??= y) // => 5
console.log(x = (x ?? y)) // => 5
仅当值为 null 或 undefined 时,此赋值运算符才会赋值。
上面的例子强调了这个运算符本质上是空赋值的语法糖(译者注,类似的语法糖:a = a + b 可写成 a += b )。
接下来,让我们看看这个运算符与默认参数(译者注,默认参数是 ES6 引入的新语法,仅当函数参数为 undefined 时,给它设置一个默认值)的区别:
function settingsWithNull(options) {
options.speed ??= 1
options.diff ??= 'easy'
return options
}
function settingsWithDefaultParams(speed=1, diff='easy') {
return {speed, diff}
}
settingsWithNullish({speed: null, diff: null}) // => {speed: 1, diff: 'easy'}
settingsWithDefaultParams(undefined, null) // => {speed: null, diff: null}
4、?. 链判断运算符
链判断运算符?. 允许开发人员读取深度嵌套在对象链中的属性值,而不必验证每个引用。当引用为空时,表达式停止计算并返回 undefined。
let book = {
name: 'js高教4',
content: {
first: 'hello world',
second: 'good work'
}
}
console.log(book.price?.zh) // => undefined