当前位置: 首页 > news >正文

JS 特殊运算符有哪些?

JavaScript 特殊运算符有哪些?

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

在这里插入图片描述

文章目录

    • 特殊运算符号有哪些?
      • 1. `??`(空值合并运算符)
      • 2. `??=`(空值合并赋值运算符)
      • 3. `?.`(可选链运算符)
      • 4. `?=`(三元运算符的简洁形式?实际上应称为逻辑空赋值运算符的误解)
      • 5. `typeof`(类型运算符)
      • 6. `instanceof`(实例运算符)
      • 7. `in`(属性运算符)
      • 8. `delete`(删除运算符)
      • 9. `void`(空运算符)
      • 10. `,`(逗号运算符)
    • 面试技巧

特殊运算符号有哪些?

1. ??(空值合并运算符)

空值合并运算符 ?? 用于当左侧操作数为 nullundefined 时,返回右侧操作数。

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

2. ??=(空值合并赋值运算符)

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

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

3. ?.(可选链运算符)

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

let user = { name: 'Alice', address: { city: 'Wonderland' } };
let city = user?.address?.city; // city 的值为 'Wonderland'
console.log(city); // 输出: Wonderlandlet 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); // 输出: stringlet y = 42;
console.log(typeof y); // 输出: numberlet z = true;
console.log(typeof z); // 输出: booleanlet 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. 利用空值合并运算符处理默认值

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

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

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

6. 理解 typeofinstanceof 的区别

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

7. 谨慎使用 delete 运算符

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

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

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

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

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

看到这里的小伙伴,欢迎点赞、评论,收藏!

如有前端相关疑问,博主会在第一时间解答,也同样欢迎添加博主好友,共同进步!!!


http://www.mrgr.cn/news/35232.html

相关文章:

  • STM32从上电开始启动过程详解(上电->分散加载->main函数)
  • 算法定制LiteAIServer摄像机实时接入分析平台玩手机打电话检测算法:智能监控的新篇章
  • 领夹麦克风哪个品牌好,手机领夹麦克风哪个牌子好,选购推荐
  • 实现3D热力图
  • Mysql 5.7.6以上版本怎样关闭GTID(由GTID改为基于file,position方式)
  • 策略模式、状态机详细解读
  • 语言的变量交换
  • yolov10算法原理
  • rust一些通用编程的概念
  • js中Fucntion的意义
  • 语言的副作用
  • 打卡软件——人脸识别综合实现
  • Python NumPy学习指南:从入门到精通
  • 应用层 III(电子邮件)【★★】
  • Vue(16)——Vue3.3新特性
  • 最小花费爬楼梯(动态规划)问题
  • 工业一体机实现接口与模块选配
  • 【后端开发】JavaEE初阶—线程安全问题与加锁原理(超详解)
  • 3270.求出数字答案题解
  • Winform—事件多播和事件联机响应
  • 【Python百日进阶-Web开发-FastAPI】Day805 - FastAPI的请求体
  • golang学习笔记14-函数(三):系统函数
  • Python语句: For 循环的详细讲解
  • CCIE证书有用吗?CCIE含金量解读!
  • js实现多行文本控件textarea,根据文本内容自适应窗口全部显示
  • C++ SLT标准模板简介