05 解构赋值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <script>
        //对于对象解构 可以使用{}  但是对于函数解构则使用[]
        //解构赋值对赋值运算符的一种扩展
        //它针对数组和对象来进行操作
        //优点:代码书写上简洁易读
        let node = {
            type:'str',
            name:'walter'
        }
        //es5赋值
        // let type = node.type;
        // let  name = node.name;

        //es6解构赋值 取值
        let {type,name} = node;
        console.log(type,name)//str walter


        //不完全解构,可以忽略一些对象
        let obj = {
            a:{
                name:'walter'
            },
            b:[],
            c:'hello'
        }
        //只取对象a  只能用名字a
        // let{a} = obj;
        // console.log(a)//{name: "walter"}

        //剩余运算符
        // let {a,...res} = obj;
        // console.log(res) //{b: Array(0), c: "hello"}

        //默认值 a为20 b默认30
        // let {a,b=30} = {a:20};



        //对数组解构
        // let arr = [1,2,3];
        // let [a,b,c] = arr;
        // console.log(a,b,c)//1 2 3 完全解构
        // console.log(a,b)//1 2  不完全解构

        //可嵌套
        let [a,b,c] = [1,[2,4],4]
        console.log(a,b,c)//1 (2) [2, 4] 4


    </script>
</body>
</html>
原文地址:https://www.cnblogs.com/wuhui1222/p/14202509.html