java对象赋值给数组_带你深入的理解数组和对象的解构赋值。

本文详细介绍了ES6中的解构赋值特性,包括如何从数组和对象中提取数据并赋值给变量,如模式匹配、跳过元素、剩余元素赋值、默认值设置以及在函数返回值和嵌套对象中的应用。此外,还讨论了解构失败时赋值为undefined的情况和一些注意事项,例如默认值的懒惰求值、变量声明和计算属性名称。
摘要由CSDN通过智能技术生成

es6提供了一个非常好的特性,即变量的解构赋值。从而我们可以方便的从数组和对象中提取数据并将它们赋值给变量。这是非常必要的。先来看在这个新特性发布之前我们是如何从数组中提取数据的。如下:

let nums = [1,2,3,4,5];

let num1 = nums[0];

let num2 = nums[1];

console.log(num1); // logs 1

console.log(num2); // logs 2

复制代码

为了从 nums 数组中提取到数据,我们多次重复着相同的代码。es6的解构赋值将会让这个操作变得非常的容易且易于理解。

数组的解构赋值

从数组中取值并按照对应位置对变量进行赋值。如下:

let [num1,num2,num3] = [1,2,3];

console.log({num1},{num2},{num3})

复制代码

488fa81828a04c78846c686710896c7d.png

“模式匹配”赋值

这属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。

let [num_s,nums,num_e] = [1,[2,3,4],5];

console.log(num_s) // logs 1

console.log(nums) // logs [2,3,4]

console.log(num_e) // logs 5

复制代码

用逗号跳过元素

let [num1,,,num4] = [1,2,3,4];

console.log(num1) // logs 1

console.log(num4) // logs 4

let [,num2,,num4] = [1,2,3,4];

console.log(num2) // logs 2

console.log(num4) // logs 4

复制代码

查看变量赋值左侧的数组。注意这里不是只有一个逗号,而是三个。逗号分隔符用于跳过数组中的值。所以如果你想要跳过数组中的一个项,只要用逗号就可以了。

数组中的其余部分的赋值

如果我们想将数组中的一些元素赋值给变量,而将数组中的其余元素存为一个数组赋值给指定的变量怎么办?在这种情况下,我们可以这样做:

let [num1,...nums] = [1,2,3,4];

console.log(num1) // logs 1

console.log(nums) // logs [2,3,4]

复制代码

应用这种方式,你可以轻松的把剩余的元素赋值给一个指定的变量。

解构失败,赋值undefined

let [num1] = [];

let [num2, num3] = [1];

console.log(num1) // logs undefined

console.log(num3) // logs undefined

复制代码

代码中的变量num1与变量num3 按照模式匹配原则,并没有对应的值与之匹配,故而返回undefined。而变量num2 按照模式匹配原则,被赋值为2。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaScript中,解构赋值是一种方便的语法,可以将数组对象中的成员解构出来并赋值给变量。对于数组解构,可以使用方括号来指定要解构的变量,然后将数组的对应元素赋值给这些变量。例如,如果我们有一个存放了名字和姓氏的数组`arr`,我们可以使用解构赋值数组的元素赋值给对应的变量。\[2\] 在对象解构中,我们可以使用花括号来指定要解构的变量,然后将对象的对应属性值赋值给这些变量。例如,如果我们有一个对象`obj`,其中包含`name`和`age`属性,我们可以使用解构赋值将这些属性值赋值给对应的变量。\[1\] 此外,我们还可以将`.entries()`方法与解构语法一同使用,来遍历一个对象的键值对。这个方法返回一个包含对象的键值对的数组,然后我们可以使用解构赋值将键和值分别赋值给对应的变量。\[3\] 希望这个解答对你有帮助! #### 引用[.reference_title] - *1* [解构赋值数组解构、对象解构)](https://blog.csdn.net/qq_50260510/article/details/129927253)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* *3* [ES6 --- 解构赋值数组对象,函数)使用详解](https://blog.csdn.net/m0_52409770/article/details/123096308)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值