JS 特殊运算符有哪些?

news2024/9/25 3:30:36

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); // 输出: 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. 利用空值合并运算符处理默认值

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

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

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

6. 理解 typeofinstanceof 的区别

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

7. 谨慎使用 delete 运算符

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

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

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

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

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

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

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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2162270.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【SSM-Day2】创建SpringBoot项目

运行本篇中的代码:idea专业版或者idea社区版本(2021.1~2022.1.4)->这个版本主要是匹配插件spring boot Helper的免费版(衰) 【SSM-Day2】创建SpringBoot项目 框架->Spring家族框架快速上手Spring Boot📢用idea插件创建Sprin…

python文件读写知识简记

简单记录一下python文件读写相关知识 一、打开文件 python使用open函数打开文件,函数原型如下 open(file, moder, buffering-1, encodingNone, errorsNone, newline None, closefdTrue, openerNone) file 文件地址 mode 文件打开模式,可设定为如下的…

harmonyOS ArkTS最新跳转Navigation

文章目录 取消标题栏初始页面(load)设置为竖屏 自定义标题Tabs&TabContentTabs通过divider实现了分割线各种属性 图片下载 官方文档 Entry Component struct Index {State message: string Hello WorldState djs:number 5build() {Column(){Navigation(){}.title("g…

一文详解GB28181、RTSP、RTMP

GB28181 GB28181 即 GB/T28181—2016《公共安全视频监控联网系统信息传输、交换、控制技术要求》。它是公安部提出的公共安全行业标准,在视频监控领域具有重要地位。 主要目的和应用场景: 目的:解决不同厂家的视频监控设备执行各自标准&…

9.24 C++ 常成员,运算符重载

//my_string.cpp #include "my_string.h" #include <iostream> #include <cstring>using namespace std;My_string::My_string():size(15){this->ptr new char[size];this->ptr[0] \0; //表示串为空串this->len 0;}//有参构造My_…

业务数据批量插入数据库实践

业务数据如何存储一直以来都是项目开发中的一个比较重要的话题。我们要从资源的利用率&#xff0c;业务场景和技术实现多个方面考虑存储的问题。“抛开业务谈技术就是耍流氓”&#xff0c;所有技术架构都要站在实际的业务场景中分析。比如个人端的产品&#xff0c;这种就属于读…

代码随想录算法训练营Day7 | 454.四数相加Ⅱ、383.赎金信、15.三数之和、18.四数之和

454.四数相加Ⅱ 题目 454. 四数相加 II - 力扣&#xff08;LeetCode&#xff09; 给你四个整数数组 nums1、nums2、nums3 和 nums4 &#xff0c;数组长度都是 n &#xff0c;请你计算有多少个元组 (i, j, k, l) 能满足&#xff1a; 0 < i, j, k, l < nnums1[i] nums…

weblogic中间件漏洞复现

后台弱口令getshell 1.开启环境 cd vulhub-master/weblogic/weak_password docker-compose up -d docker ps 2.f访问靶场 访问/console/login/LoginForm.jsp这个目录进行登录&#xff0c; 默认账号密码&#xff1a;weblogic/Oracle123 需要注意的是单个账号进行登录时&…

C++_CH18_构造函数与析构函数

C_CH18_构造函数与析构函数 1 类的默认成员函数 在编写类的时候&#xff0c;C编译器会默认生成6个默认的函数&#xff0c;但是不显示出来&#xff1a; 需要关注以下两个方面: 第一:我们不写时&#xff0c;编译器默认生成的函数行为是什么&#xff0c;是否满足我们的需求。 …

LabVIEW界面输入值设为默认值

在LabVIEW中&#xff0c;将前面板上所有控件的当前输入值设为默认值&#xff0c;可以通过以下步骤实现&#xff1a; 使用控件属性节点&#xff1a;你可以创建一个属性节点来获取所有控件的引用。 右键点击控件&#xff0c;选择“创建” > “属性节点”。 设置属性节点为“D…

实践出真知!8个案例速通栅格系统

在现代设计中&#xff0c;栅格系统作为一种重要的布局方案&#xff0c;能够有效提升设计的秩序感。对于 UI 设计领域&#xff0c;栅格系统也广泛用于跨屏幕的响应式设计&#xff0c;帮助设计师打造更好的多端体验。本文将简要介绍栅格系统的基本概念和搭建方法&#xff0c;并提…

什么是unix中的fork函数?

一、前言 在本专栏之前的文档中已经介绍过unix进程环境相关的概念了&#xff0c;本文将开始介绍unix中一个进程如何创建出新进程&#xff0c;主要是通过fork函数来实现此功能。本文将包含如下内容&#xff1a; 1.fork函数简介 2.父进程与子进程的特征 3.如何使用fork创建新进程…

依赖不对应导致java文件不能正常显示

项目中若出现非正常显示的java文件&#xff0c;检查下是否依赖版本不对应。&#xff08;前提必须是maven项目&#xff09;

网络原理(4)——网络层(IP)、数据链路层

1. IP 协议 基本概念&#xff1a; 主机&#xff1a;配有 IP 地址&#xff0c;但是不进行路由控制的设备 路由器&#xff1a;即配有 IP 地址&#xff0c;又能进行路由控制 节点&#xff1a;主机和路由器的统称 IP 协议报头格式 1) 4 位版本&#xff1a;实际上只有两个取值&…

通义灵码AI 程序员正式发布:写代码谁还动手啊

虽然见不到面 但你已深潜我心 前几天&#xff0c;在 2024 年的杭州云栖大会上&#xff0c;随着通义大模型能力的全面提升&#xff0c;阿里云通义灵码这位中国的首位 AI 程序员也迎来重大的升级。 一年前这位 AI 程序员还只能完成基础的编程任务&#xff0c;到现在可以做到几…

Leetcode 543. 124. 二叉树的直径 树形dp C++实现

问题&#xff1a;Leetcode 543. 二叉树的直径&#xff08;边权型&#xff09; 给你一棵二叉树的根节点&#xff0c;返回该树的 直径 。 二叉树的 直径 是指树中任意两个节点之间最长路径的 长度 。这条路径可能经过也可能不经过根节点 root 。两节点之间路径的 长度 由它们之…

探索未来:MultiOn,AI的下一个革命

文章目录 探索未来&#xff1a;MultiOn&#xff0c;AI的下一个革命背景&#xff1a;为什么选择MultiOn&#xff1f;MultiOn是什么&#xff1f;如何安装MultiOn&#xff1f;简单的库函数使用方法场景应用常见问题及解决方案总结 探索未来&#xff1a;MultiOn&#xff0c;AI的下一…

图表示学习中的Transformer:Graphormer的突破

人工智能咨询培训老师叶梓 转载标明出处 在自然语言处理和计算机视觉等领域&#xff0c;Transformer架构已经成为主导选择。然而&#xff0c;在图级别的预测任务中&#xff0c;它的表现并不如主流的图神经网络&#xff08;GNN&#xff09;变体。这一现象引发了一个思考&#x…

指针变量的自增、自减运算

指针变量的自增、自减运算相比较于普通变量的自增、自减运算又什么区别呢&#xff1f; 让我们先来复习一下普通变量的自增、自减运算 int main() {int i; //定义一个整型变量printf("请输入一个数字&#xff1a;\n");scanf("%d&qu…

JetBrains系列产品无限重置免费试用方法

JetBrains系列产品无限重置免费试用方法 写在前面安装插件市场安装插件 写在前面 支持的产品&#xff1a; IntelliJ IDEA AppCode CLion DataGrip GoLand PhpStorm PyCharm Rider RubyMine WebStorm为了保证无限重置免费试用方法的稳定性&#xff0c;推荐下载安装2021.2.2及其…