【JavaScript】37_解构对象与对象的解构

举报
魔天伦 发表于 2023/03/06 12:56:34 2023/03/06
【摘要】 1、解构对象数组中可以存储任意类型的数据,也可以存数组,如果一个数组中的元素还是数组,则这个数组我们就称为是二维数组解构对象,方便两数交换数值;可以反向赋值对象,数组可以在解构的同时,进行声明 <script> const arr = ["孙悟空", "猪八戒", "沙和尚"] let a, b, c // a =...

1、解构对象

数组中可以存储任意类型的数据,也可以存数组,

如果一个数组中的元素还是数组,则这个数组我们就称为是二维数组

解构对象,方便两数交换数值;可以反向赋值对象,数组

可以在解构的同时,进行声明

    <script>
        const arr = ["孙悟空", "猪八戒", "沙和尚"]

        let a,
        b,
        c
        // a = arr[0]
        // b = arr[1]
        // c = arr[2]
        ;
        [a,b,c] = arr;//解构赋值

        let [d,e,f,g] = ['唐僧','白骨精','蜘蛛精','玉兔精']//声明同时解构
        
        // ;[d,e,f,g] = [1,2,3]
        // ;[d,e,f=77,g=10] = [1,2,3]
        ;[d,e,f=43,g=g] = [1,2,3]//直接这样的话,会显得g未定义
        console.log(d,e,f,g)

        let [n1,n2,...n3] = [4,5,6,7] // 解构数组时,可以使用...来设置多余的元素

        function fn(){
            return ['二郎神','猪八戒']
        }

        let [name1,name2] = fn();
        console.log(name1,name2)

        //可以通过解构赋值来快速交换两个变量的值
        let a1 = 10
        let a2 = 20

        //以前的方法,需要一个中间值来交换两数值
        // let temp = a1
        // a1 = a2
        // a2 = temp

        ;[a1,a2] = [a2,a1]//[20,10]

        const arr2 = ['孙悟空','猪八戒']
        ;[arr2[0],arr2[1]] = [arr2[1],arr2[0]]
        console.log(arr2)

        const arr3 = [['孙悟空',18,'男'],['猪八戒',45,'男']]
        for(let stu of arr3){
            for(let v of stu){
                console.log(v)
            }
        }

        let [[name,age,gender],obj] = arr3
        console.log(name,age,gender)
        console.log(obj)
    </script>

2、对象的解构

    <script>
        const obj = {name:'孙悟空',age:18,gender:'男'}

        // let {name,age,gender} = obj // 声明变量同时解构对象

        let name,age,gender
        ;({name,age,gender} = obj)//如果不加小括号的话,会被JS认为是代码块,但是加了小括号之后还需要添加分号,防止JS误认

        let {address} = obj;//没有的属性返回undefined
        console.log(name,age,gender,address)

        let {name: a,age: b,gender: c,address: d='花果山'} = obj
        console.log(a,b,c,d)
</script>
【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。