解构赋值(ES6)

解构赋值(ES6)

解构赋值语法是一种 Javascript 表达式。通过解构赋值, 可以将属性/值从对象/数组中取出,赋值给其他变量。

let a, b, rest;
[a, b] = [10, 20];

console.log(a);
// expected output: 10

console.log(b);
// expected output: 20

//分配剩余值
[a, b, ...rest] = [10, 20, 30, 40, 50];

console.log(rest);
// expected output: Array [30,40,50]






1、忽略值

const[apple,,banana]=['apple','pear','bna','da','xiaoi'];console.log(apple,banana);

2、组合数组和对象解构

const [, , { name }] = [
      { id: 1, name: 'apple' },
      { id: 2, name: 'banana' },
      { id: 3, name: 'pear' }

    ]
    console.log(name)    //pear

3、交换数组中的变量


//常规
var temp = array[index1];

array[index1] = array[index2];
array[index2] = temp;

//解构
const fruits= ['apple','pear','banana']
[fruits[2],fruit[1] ] =  [fruits[1],fruit[2] ] 


4、重命名变量
对象键经常包含拼写错误或与它们的值没有明确的关系。为了克服这个问题,您可以在解构对象时设置一个新的变量名称。解压缩值时,只需写一个冒号, 后跟新名称。
在这里插入图片描述

5、默认值

给 变量设置默认值,解构时设置默认值非常简单。只需在变量名后写一个 = 符号,并提供默认值。当数组或对象中的值未定义时——任何另一个空值都将被解包——默认值被分配给变量。

在这里插入图片描述

6、解构正则表达式
正则表达式用于定位字符串中的模式。当在 javascript 中执行正则表达式 (RegExp.exec() ) 时,匹配项将作为字符串数组返回。
在这里插入图片描述7、嵌套解构
对象和数组并不总是平坦的。赋值可以嵌套在一个子句中以直接达到所需的级别。
在这里插入图片描述
8、动态对象键
在这里插入图片描述
9、解构函数参数

在之前的所有示例中,我们将对象值解包为变量。但是如果一个对象作为函数参数提供,我们可以一起跳过这一步。函数参数可以直接解构,使值可用于函数体。
在这里插入图片描述

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值