资讯专栏INFORMATION COLUMN

es6 解构赋值

oliverhuang / 3499人阅读

摘要:结构赋值即按照一种模式对变量进行赋值,分为数组解构赋值和对象结构赋值数组结构赋值数组类型解构赋值输出若左右没有配对成功,则会输出。即为可以进行交换,输出输出输出输出对象解构赋值对象解构赋值左右都是对象输出

结构赋值即按照一种模式对变量进行赋值,分为数组解构赋值和对象结构赋值

1. 数组结构赋值

let a;
[a,b]=[1,2]//数组类型解构赋值
console.log(a);//1


[a,b,...rest]=[1,2,3,4,5,6]//输出1,2,[3,4,5,6]


[a,b,c=3]=[1,2] //a=1,b=2,c=3

[a,b,c]=[1,2]//若左右没有配对成功,则会输出undefined。即c为undefined


let a=1;
let b=2;
[a,b]=[b,a];//可以进行交换,输出2,1


function f(){
    return [1,2]
}
let a,b;
[a,b]=f();//输出1,2


function f(){
    return [1,2,3,4,5]
}
let a,b,c;
[a,,,b]=f();//a,b输出1,4


function f(){
    return [1,2,3,4,5]
}
let a,b,c;
[a,...b]=f();//a,b输出1,[2,3,4,5]

2.对象解构赋值

let o={p:42,q:true} 
let {p,q}=o;//对象解构赋值左右都是对象
console.log(p,q);//42,true


let {a=10,b=5}={a:3};
console.log(a,b);//3,5


let metaData={
    title:"abc",
    test:[{
        title:"test",
        desc:"description"
    }]
}
let {title:esTitle,test:[{title:cnTitle}]}=metaData;
console.log(esTitle,cnTitle);//输出abc,test

 

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1925.html

相关文章

  • ES6 学习笔记(一)let,const和解构赋值

    摘要:另外对于已经声明的变量进行解构赋值时,要非常小心。因此在行首加,将其强制转化为表达式执行。由于和无法转为对象,所以对它们进行解构赋值,都会报错。 let和const let和const是es6新增的两个变量声明关键字,与var的不同点在于: (1)let和const都是块级作用域,在{}内有效,这点在for循环中非常有用,只在循环体内有效。var为函数作用域。 (2)使用let和con...

    iOS122 评论0 收藏0
  • es6 - 解构赋值

    摘要:比如上面展示的情况都是可以联合使用的比如对象的解构赋值对象的解构赋值是基于属性的。当给已存在的变量解构赋值时,注意加这是由于如果不加会把左边看成一个代码块,会报错。注意事项数组的解构赋值中,使用的变量必须放在最后。 解构赋值 解构赋值是一个听起来比较高大上的特性,但按我的理解,它就是一种语法糖。它并没有赋予js更强大的能力,只是让赋值操作更加的灵活,效率。 在es6之前,赋值操作需要=...

    DirtyMind 评论0 收藏0
  • ES6学习 第二章 变量的解构赋值

    摘要:前言前言该篇笔记是第二篇变量的解构赋值。这一章原文链接变量的解构赋值解构赋值解构赋值允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构。对象的解构赋值是根据对象值进行匹配。前言该篇笔记是第二篇 变量的解构赋值。这一章原文链接: 变量的解构赋值解构赋值ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。解构赋值是对赋值运...

    番茄西红柿 评论0 收藏2637
  • ES6学习 第二章 变量的解构赋值

    摘要:前言该篇笔记是第二篇变量的解构赋值。这一章原文链接变量的解构赋值解构赋值允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构。对象的解构赋值是根据对象值进行匹配。 前言该篇笔记是第二篇 变量的解构赋值。 这一章原文链接: 变量的解构赋值解构赋值ES6 允许按照一定模式,从数组和对象中提取值,对...

    番茄西红柿 评论0 收藏2637
  • ES6-变量的解构赋值(3)

    摘要:数组的解构赋值特点根据数据的下标来赋值的,有次序。模式能够匹配起来,如长度为数值和布尔值的解构赋值解构赋值的规则是只要等号右边的值不是对象或数组,就先将其转为对象。布尔值解构赋值为字符串的一种。在很多独立细小的方面,解构赋值都非常有用。 1、解构赋值简介 官方解释:按照一定的模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。 举个例子,想获取数组中...

    Jason_Geng 评论0 收藏0
  • ES6学习2》 变量的解构赋值

    摘要:解构赋值的分类数组解构赋值对象解构赋值字符串解构赋值数值解构赋值布尔值解构赋值函数参数解构赋值。嵌套情况默认值解构赋值允许设置默认值,当数组成员严格等于,默认值将生效。报错报错函数参数的解构赋值函数的参数也可以使用解构赋值和指定默认值 ES6可以从数组和对象中提取值,然后对变量进行赋值。解构赋值的分类:数组解构赋值、对象解构赋值 、字符串解构赋值、数值解构赋值、布尔值解构赋值、 函数参...

    mist14 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<