JS 特殊运算符的使用

众多编程语言之中JavaScript ，以其强大而全面的功能深受前端开发者喜爱。其丰富的运算符集，不仅包括了广泛应用的算术运算符、比较运算符以及逻辑运算符，还蕴藏着一系列较为冷门但同样功能强大的运算符。这些不常被提及的运算符，或许因它们特定的应用场景或是相对少见的使用频率，而未能广泛进入开发者的视野。然而，深入了解并掌握这些运算符，无疑能够为我们的开发工作增添更多的便利与高效。接下来，让我们一同了解下哪些冷漠且很适用的运算符~

特殊运算符号有哪些？

1. ??（空值合并运算符）

空值合并运算符 ?? 用于当左侧操作数为 null 或 undefined 时，返回右侧操作数。

let x = null;
let y = 'default';
let z = x ?? y; // z 的值为 'default'
console.log(z); // 输出: default

2. ??=（空值合并赋值运算符）

空值合并赋值运算符 ??= 用于当左侧变量为 null 或 undefined 时，将右侧的值赋给左侧的变量。

let x = null;
let y = 'value';
x ??= y; // x 的值变为 'value'
console.log(x); // 输出: value

3. ?.（可选链运算符）

可选链运算符 ?. 允许我们安全地访问深层嵌套的属性，而不用担心中间某个属性是 null 或 undefined。

let user = { name: 'Alice', address: { city: 'Wonderland' } };
let city = user?.address?.city; // city 的值为 'Wonderland'
console.log(city); // 输出: Wonderland

let nullUser = null;
let nullCity = nullUser?.address?.city; // nullCity 的值为 undefined
console.log(nullCity); // 输出: undefined

4. ?=（三元运算符的简洁形式？实际上应称为逻辑空赋值运算符的误解）

注意：这里有一个小误区，?= 并不是三元运算符的简洁形式，而是逻辑空赋值运算符（Logical Nullish Assignment ??=）的一部分，已在上面介绍。真正的三元运算符是 ?:，用于简单的条件判断。

let age = null;
age = age ? age : 18; // 传统三元运算符用法，如果 age 为 null 或 undefined，则赋值为 18
console.log(age); // 输出: 18

// 使用 ??= 简化
let age2 = null;
age2 ??= 18; // 如果 age2 为 null 或 undefined，则赋值为 18
console.log(age2); // 输出: 18

5. typeof（类型运算符）

typeof 运算符用于判断一个变量的类型。

let x = 'Hello, world!';
console.log(typeof x); // 输出: string

let y = 42;
console.log(typeof y); // 输出: number

let z = true;
console.log(typeof z); // 输出: boolean

let u;
console.log(typeof u); // 输出: undefined

6. instanceof（实例运算符）

instanceof 运算符用于测试一个对象是否在其原型链原型上具有一个构造函数的 prototype 属性。

class Animal { }
class Dog extends Animal { }

let dog = new Dog();
console.log(dog instanceof Dog); // 输出: true
console.log(dog instanceof Animal); // 输出: true

7. in（属性运算符）

in 运算符用于检查对象是否具有指定的属性。

let obj = { a: 1, b: 2 };
console.log('a' in obj); // 输出: true
console.log('c' in obj); // 输出: false

8. delete（删除运算符）

delete 运算符用于删除对象的属性。

let obj = { a: 1, b: 2 };
delete obj.a;
console.log(obj); // 输出: { b: 2 }

9. void（空运算符）

void 运算符用于计算一个表达式，并返回 undefined 作为结果。

let x = void (0); // x 的值为 undefined
console.log(x); // 输出: undefined

10. ,（逗号运算符）

逗号运算符用于评估两个表达式，并返回最后一个表达式的结果。

let x = (1, 2); // x 的值为 2
console.log(x); // 输出: 2

面试技巧

1. 理解并熟悉每个运算符的用途、优点

在面试中，对 JavaScript 运算符的深刻理解能够帮助你快速解决算法问题，并写出更简洁、高效的代码。

2. 注意运算符的优先级和结合性

了解运算符的优先级和结合性（即运算顺序）对于避免逻辑错误至关重要。例如，*（乘法）的优先级高于 +（加法）。

3. 使用可选链运算符简化代码

在访问嵌套对象属性时，使用可选链运算符 ?. 可以避免繁琐的条件检查，使代码更简洁、易读。

4. 利用空值合并运算符处理默认值

在处理可能为 null 或 undefined 的变量时，使用空值合并运算符 ?? 可以方便地设置默认值，减少代码冗余。

5. 掌握三元运算符的简洁写法

三元运算符 ?: 是条件判断的一种简洁写法，可以在一行内完成简单的条件逻辑，使代码更加紧凑。

6. 理解 typeof 和 instanceof 的区别

typeof 用于判断变量类型，而 instanceof 用于判断对象是否是某个构造函数的实例，两者在用途上有所不同。

7. 谨慎使用 delete 运算符

delete 运算符可以删除对象的属性，但删除数组元素时应谨慎，因为它不会改变数组长度，只是将元素值设置为 undefined。

8. 熟悉逗号运算符的用途

逗号运算符在某些情况下可以简化代码，例如在 for 循环中同时更新多个变量。

9. 利用 void 运算符避免不必要的返回值

void 运算符可以用于避免函数或表达式返回不必要的值，确保代码逻辑的清晰性。

到此这篇关于JS 特殊运算符的使用的文章就介绍到这了,更多相关JS 特殊运算符内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

最新评论