首页 > 其他分享 >ES6中的解构赋值(数组,对象,嵌套,默认值)

ES6中的解构赋值(数组,对象,嵌套,默认值)

时间:2022-11-13 20:23:47浏览次数:51  
标签:ES6 console log 解构 let 默认值 赋值

解构赋值

通过解构赋值,可以快速从对象或者数组中取出属性或者数值。

  1. 解构赋值

    可以通过定位到数组或者对象的某一个位置,将值直接赋给一个或多个变量。

    const arr = ['dasha', 'ersha', 'gangdan']
    let [a, b, c] = arr	//a='dasha' b='ersha' c='gangdan'
    //假如需要交换ab的值 只需要
    [a, b] = [b, a]
    
  2. 解构赋值嵌套

    复杂的对象或者数组也可以使用这种方法。

    const arr = [1, [2,3,4], 5]
    let [a, [b,,d], c] = arr
    
    console.log(a)	// 1
    console.log(b)	// 2
    console.log(d) 	// 4
    
  3. 解构赋值的默认值

    给变量先设置好默认值,当数组或者对象中无法找到匹配的值,则将默认值赋给变量。

    let [a=1] = [100] // a=100
    let [b=1] = [] // b=1
    
  4. 解构赋值用在对象上时候,需要用键的方式

    const obj = {
        name:'shabi',
        age:12,
    }
    let{age} = obj
    
    // 为了防止age在上面被let定义过了,可以将age改名为ag
    let{age:ag, err="定义err默认值即使对象中没有这个属性,也可以获取到这个默认值字符串"} = obj
    console.log(err)// '定义err默认值即使对象中没有这个属性,也可以获取到这个默认值字符串'
    
  5. 解析一个从函数返回的数组

    获取返回值进行解构赋值,更加方便

    function test(){
        return [1,2,3]
    }
    let [x,y] = test()
    console.log(x)	//x = 1
    console.log(y)	//y = 2
    
  6. rest写法:将剩下的所有值赋值给一个变量

    这种写法只能适用于用在最后一位,无法用在开头或者中间,否则会报错。

    let [a,...rest] = [1, 2, 3];
    console.log(a); // 1
    console.log(rest); // [2, 3]
    

标签:ES6,console,log,解构,let,默认值,赋值
From: https://www.cnblogs.com/waterrec/p/16886780.html

相关文章

  • 【ES6】模块化
    模块化1、模块化模块化是指将一个大的程序文件,拆分成许多小的文件,然后将小文件组合起来。2、ES6模块化语法模块功能主要由两个命令构成:export和importexport命令用于......
  • Javascript(笔记32) - ES6特性 - let
    Javascript(笔记32)-ES6ECMA EuropeanComputerManufactureresAssociation,中文名:欧洲计算机制造商协会,目标是评估、开发和认可电信和计算机标准。1994年后改名为 ECM......
  • #yyds干货盘点#ES6 Class 的继承
    类的继承​​extends​​简介Class可以通过​​extends​​关键字实现继承,让子类继承父类的属性和方法。extends的写法比ES5的原型链继承,要清晰和方便很多。classPoint......
  • SpringBoot+Vue实现excel导入带格式化的时间参数(moment格式化明天日期并设置el-date-
    场景若依管理系统前后端分离版基于ElementUI和SpringBoot怎样实现Excel导入和导出:https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/108278834在上面进行Ex......
  • 【JS】8 种 ES6 中扩展运算符的用法
    扩展操作符 … 是ES6中引入的,将可迭代对象展开到其单独的元素中,所谓的可迭代对象就是任何能用forof循环进行遍历的对象,例如:数组、字符串、Map、Set、DOM节点等。1、拷贝......
  • Es6面型对象 class类
    在js中,function可以看做为方法,构造函数可以看做为类在Es6中,class(类)作为对象的模板被引用,可以通过class关键字定义;class的本质是functionEs5就支持class概念贴点:  1......
  • 【Protobuf(二)】protobuf3 默认值
    /***关于protobuf3默认值问题*首先,pb对象的get方法永远不会有null,如果没有设置,会生成对应的默认值**如果属性值是一个message,那么pb会为这个属性生......
  • MYSQL给ID设置默认值为UUID
    MYSQL给ID设置默认值为UUID标签: mysql  id  触发器  默认值      由于mysql并不支持默认值为函数类型,给id设值有两种方式:(1)通过后台在执行插入......
  • 举例说明了十大ES6功能
    虽然ES6规范不是最近才发布,但我认为很多开发人员仍然不太熟悉。主要原因是在规范发布之后,Web浏览器的支持可能很差。目前,规范发布已经超过2年了,现在很多浏览器对ES6支持......
  • 源码路 之 聊聊 Button 默认值引发的坑坑
    LZ-Says:enmmm,希望所有的一切都将会有一个好的结果。虽然菜比一个,但是只要努力了,就会有好的结果~!!!前言Enmmm,今天突然奇想,玩玩shape文件。Enmmm,我想的挺美好的。结果,mmp了。......