变量和对象的解构赋值

解构赋值是一种 JavaScript 语言特性,允许你将数组或对象的属性直接赋值给变量。这对于从函数返回多个值或初始化多个变量非常有用。

对象解构赋值:
当你有一个对象,你想将它的属性赋值给一些变量时,你可以使用解构赋值。例如:

const person = {  firstName: 'John',  lastName: 'Doe'  
};  const { firstName, lastName } = person;  console.log(firstName);  // 输出: John  
console.log(lastName);    // 输出: Doe


在上述代码中,我们创建了一个新的 firstName 和 lastName 变量,并将它们分别初始化为 person 对象的 firstName 和 lastName 属性的值。


2. 数组解构赋值:

当你想从数组中取出元素并赋值给变量时,也可以使用解构赋值。例如:

const colors = ['red', 'green', 'blue'];  const [firstColor, secondColor, thirdColor] = colors;  console.log(firstColor);  // 输出: red  
console.log(secondColor);  // 输出: green  
console.log(thirdColor);   // 输出: blue


在上述代码中,我们创建了新的 firstColor、secondColor 和 thirdColor 变量,并将它们分别初始化为 colors 数组的第一个、第二个和第三个元素。


3. 默认值:

如果数组或对象的某些属性不存在或有默认值,你可以在解构时指定默认值。例如:

const person = { firstName: 'John' };  // 只定义了 firstName 属性  const { firstName, lastName = 'Doe' } = person;  console.log(firstName);    // 输出: John  
console.log(lastName);      // 输出: Doe(因为 person 对象没有 lastName 属性,
//所以使用了默认值)


在上述代码中,如果 person 对象没有 lastName 属性,那么 lastName 变量将使用默认值 'Doe'。

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

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

相关文章

JavaScript-运算符-笔记

1.算术运算符 加 -减 *乘法 /除法 乘方: ** a**6:a的6次方 --- a*a*a*a*a*a 取余: % 10%31 偶数: 能被2整除 和2取余等于0 奇数: 不能被2整除 和2取余不等于0 能被6整除(是6的倍数): 和6取余等于0 2.递增递减运算符 : 依次加1 -- : 依次减1 单独使…

【RockChip | RV1126】学习与开发

【RockChip | RV1126】学习与开发 文章目录 【RockChip | RV1126】学习与开发1. 资料1. 资料 您好,这是关于A191型RV1126的资料包,请您及时接收哦~链接: https://pan.baidu.com/s/1FXWVxa27Q78nI78d2QKlBQ?pwd=j7mk 提取码: j7mk 若您在开发过程中遇到技术问题,需要帮助时:…

3D Gaussian Splatting 训练自己的数据scene

目录 训练教程: 1 colmap安装: 2.1生成初始点云 2.2训练流程 读ColmapScene

基于OpenCV的图像翻转和镜像

我们将解释如何在Python中实现图像的镜像或翻转。大家只需要了解各种矩阵运算和矩阵操作背后的基本数学即可。 01. 依赖包要求 NumPy —用于矩阵运算并对其进行处理。 OpenCV —用于读取图像并将其转换为2D数组(矩阵)。 Matplotlib —用于将矩阵绘制为…

react setState调用为什么会触发整个组件函数的重新运行

react setState调用为什么会触发整个组件函数的重新运行例如下面的代码 function App(){const [age,setAge]useState(5);const clickHandler()>{setAge(5)}console.log("点击div时候&#xff0c;我也会被刷新")return (<div onClick{clickHandler}><di…

【LeetCode:228. 汇总区间 | 区间】

&#x1f680; 算法题 &#x1f680; &#x1f332; 算法刷题专栏 | 面试必备算法 | 面试高频算法 &#x1f340; &#x1f332; 越难的东西,越要努力坚持&#xff0c;因为它具有很高的价值&#xff0c;算法就是这样✨ &#x1f332; 作者简介&#xff1a;硕风和炜&#xff0c;…

分析抖音直播弹幕评论和礼物的websocket数据流信息,通过proto协议解析消息内容思路

现在定位到一个解析的大概位置&#xff1a; e.decode function(e, t) {e instanceof o || (e o.create(e));for (var n, i, s void 0 t ? e.len : e.pos t, u new r.webcast.im.MemberMessage(r.webcast. 通过请求找到发送请求的js代码位置&#xff0c;然后通过跟踪这…

【远程计算机,这可能是由于 Credssp 加客数据库修正】解决方案

1、winR打开运行窗口 输入gpedit.msc命令&#xff0c;若找不到&#xff0c;可以进行如下文件编辑格式为cmd echo offpushd "%~dp0"dir /b C:\Windows\servicing\Packages\Microsoft-Windows-GroupPolicy-ClientExtensions-Package~3*.mum >List.txtdir /b C:\Win…

centos通过yum 安装nginx和基本操作

Yum安装Nginx 1、配置Centos 7 Nginx Yum源仓库(注意系统版本要匹配&#xff0c;此步根据环境来确认&#xff0c;不是必须的&#xff09; rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ngx.noarch.rpm 2、安装Nginx yum install n…

宏基因组序列无参考基因组装工具idba-ud的介绍及详细使用方法

介绍 idba-ud工具是一种用于组装无参考基因组的工具&#xff0c;它可以将高通量测序数据转化为基因组序列。它是idba工具的升级版本&#xff0c;专门用于组装多样性的无参考基因组。 idba-ud的主要作用是通过组装测序数据&#xff0c;生成无参考基因组的序列。它能够处理短读…

C#中List<T>底层原理剖析

C#中List底层原理剖析 1. 基础用法2. List的Capacity与Count&#xff1a;3.List的底层原理3.1. 构造3.2 Add()接口3.3 Remove()接口3.4 Inster()接口3.5 Clear()接口3.6 Contains()接口3.7 ToArray()接口3.8 Find()接口3.8 Sort()接口 4. 总结5. 参考 1. 基础用法 list.Max() …

【tkinter 电子时钟 实现时间日期 可实现透明 无标题栏】

下面是一个使用tkinter实现的简单的电子时钟&#xff0c;包括时间和日期的显示。该窗口是透明的&#xff0c;没有标题栏。 效果&#xff1a; import tkinter as tk from datetime import datetimedef update_time():now datetime.now()time_label.configure(textnow.strftim…

CSS效果(工作中常用)

1、css文字溢出省略号 overflow: hidden; // 溢出隐藏 text-overflow: ellipsis; // 溢出用省略号显示 white-space: nowrap; // 规定段落中的文本不进行换行 overflow: hidden; // 溢出隐藏 text-overflow: ellipsis; // 溢出用省略…

labelme的json转mask,实测有效

1、创建一个conda的虚拟环境 conda creat -n labelme python3.82、转到你的标注文件夹&#xff08;包括json和图片&#xff09; cd C:/Users/Administrator/Desktop/json3、你需要在标注文件夹下用txt写下以下代码&#xff0c;并保存bat文件。 放在最后一个就可以了 echo of…

JSON和AJAX

AJAX&#xff08;Asynchronous JavaScript and XML&#xff09;是一种无需重新加载整个页面就能更新部分网页的技术。它使用JavaScript的XMLHttpRequest对象来发送异步请求&#xff0c;并获取服务器响应。AJAX可以用于在不刷新页面的情况下更新网页内容、与服务器交换数据并更新…

while猜数字实例——C++版

案例描述&#xff1a;系统随机生成一个1到100之间的数字&#xff0c;玩家进行猜测&#xff0c;如果猜错&#xff0c;提示玩家数字过大或过小&#xff0c;如果猜对恭喜玩家胜利并退出游戏。 逻辑框图&#xff1a; #include<bits/stdc.h> using namespace std; int main()…

如何在GitHub正确提PR(Pull Requests),给喜欢的开源项目贡献代码

最好的中文TTS项目Bert-vits2更新了中文特化分支&#xff0c;但可能由于时间仓促&#xff0c;代码中存在不少的bug&#xff0c;作为普通用户&#xff0c;有的时候也想为自己喜欢的开源项目做一点点贡献&#xff0c;帮助作者修改一些简单的bug&#xff0c;那么该如何开始&#x…

Vert.x学习笔记-什么是事件总线

广义事件总线介绍Vert.x的事件总线Vert.x的事件总线的实现方式Vert.x的事件总线通信模式事件总线与消息队列的区别点对点通信模式请求-应答通信模式发布-订阅通信模式 Vert.x的事件总线应用场景Vert.x的事件总线消息Vert.x的事件总线消息示例Vert.x的事件总线的消息类型 拓展 广…

【Spark精讲】SparkSQL Join选择逻辑

SparkSQL Join选择逻辑 先看JoinSelection的注释 If it is an equi-join, we first look at the join hints w.r.t. the following order: 1. broadcast hint: pick broadcast hash join if the join type is supported. If both sides have the broadc…

四、C#高级特性(动态类型与Expando类)

在C#中&#xff0c;动态类型和ExpandoObject类是两个与运行时类型系统相关的特性&#xff0c;它们提供了更灵活的数据处理能力。 动态类型 动态类型是一种特殊的类型&#xff0c;允许你在运行时解析和操作对象的成员&#xff0c;而不需要在编译时知道这些成员的细节。使用动态…