对象的解构赋值

一、属性和方法的简写

1.属性和方法的简写:当属性名和变量名一致时,可以简写，不一致则不能简写

        let x = 1;
        let name = "xiaoming"
        let obj = {
            // x:x
            x,//属性和方法的简写:当属性名和变量名一致时,可以简写
            // 不一致则不能简写
            name: "xiaoming"
        };

二、对象的解构赋值

        对象的解构赋值：按照属性名去进行匹配，不用计较顺序

        匹配模式:变量

        let { a, b } = { a: 1, b: 2 }
        console.log({ a, b });

        let { a1, a2 } = { a2: 22, a1: 11 }
        console.log({ a1, a2 });

        let { b1: b2, b2: b1 } = { b1: 1, b2: 2 }
        console.log(b2, b1);// 1 2

        1.对象的不完全解构 没有的值还是为undefined

        let { z1: z2, z3: z4 } = { z1: 2, z4: 6 };
        console.log(z2, z4);//1 undefined

        2.对对象的解构赋值可以取到继承的属性(原型链上的属性)

        let obj1 = {
            b2: 1
        }
        obj1.__proto__ = {
            b3: 2
        }
        let { b3 } = obj1;
        console.log(b3);
        

        3.使用解构得到的方法,只是全局的函数,不是对象的方法

        let obj1 = {
            b2: 1
        }
        obj1.__proto__ = {
            b3: 2
        }
        let { b3 } = obj1;
        
        // 使用解构得到的方法,只是全局的函数,不是对象的方法
        let { toString: toString1 } = obj1;
        console.log(toString1);//tostring1只是tostring这个方法 
        //ƒ toString() { [native code] }  
        // obj1.toString1();//报错
        toString1();

        4.可以嵌套

        let obj2 = {
            p: [
                'Hello',
                { y11: 'World' }
            ]
        };
        let { p, p: [x11, { y11 }] } = obj2;
        console.log(p, x11, y11);

        // 可以嵌套
        const node = {
            loc: {
                start: {
                    line: 1,
                    column: 5
                }
            }
        };
        let { loc, loc: { start }, loc: { start: { line } } } = node;
        console.log(loc, start, line);

三、默认值的设置

1.对象的解构赋值也可以触发默认值:严格等于undefined(===undefined),赋值为null也不行

        

        let { s1 = 0 } = { s2: 1 };//0是s1变量的默认值 当s1变量的值是undefined的时候,就触发默认值
        console.log(s1);//0
        // 完整写法:
        let { s2: s3 = 0 } = { s2: 3 }

        let { s3: s4 = s5, s4: s5 } = { s3: 1 }
        console.log(s4, s5);// 1 undefined    惰性求值,没有触发s4=s5 所以不会报错  
        // let {s3:s4=s5,s4:s5}={s4:1};//找不到s3,触发默认值,这时候s5使用在暂时性死区中,报错

2.对象解构时.右侧是数组也是可以解构的,用对象的属性名匹配数组的下标

        let { 0: p1, 1: p2, p3 } = [1, 2, 3];
        console.log(p1, p2, p3);//1  2  undefined

        let arr = [1, 2, 3];
        let { 0: first, [arr.length - 1]: last } = arr;
        console.log(first,last);//1 3

        // 对象的属性名 可以是字符串\可以是数字\可以是表达式\可以是变量