es6初级之解构----之二 及 键值反转实现

1.解构： 不定参数，扩展表达式

        let arr = [100, 201, 303, 911];
        let [one, ...others] = arr;
        console.log(others.length);                    //3
        console.log(one);                              //100
        console.log(others[0]);                        //201
        console.log(others[1]);                        //303

1.2 解构：数组自身链接返回自身

        // 数组链接返回自身
        let arr = [10, 20, 30];
        let newArr = arr.concat();
        console.log(newArr);             //[10, 20, 30]

1.3 解构：

        let arr = [10, 20, 30, 200];
        let [...newArr] = arr;
        console.log(newArr);

1.4 解构：

        let User = {
            name: 'aluoha',
            age: 25,
            class: {
                group1: {
                        one: '马援',
                        two: '路博德'
                    },
                    group2: {
                        one: '卫青',
                        two: '刘邦'
                    }
            },
            arr: [10, 20, 30]
        };
        let {name,age,class: {group1},arr} = User;
        console.log(name, age, group1, group1.two, arr);        //aluoha 25 Object{}  路博德   [10,20,30]

1.4.2 解构：

  let User = {
            name: 'aluoha',
            age: 25,
            class: {
                group1: {
                        one: '张飞',
                        two: '关羽'
                    },
                    group2: {
                        one: '徐晃',
                        two: '丁典'
                    }
            },
            arr: [10, 20, 30]
        };
        let {
            name,
            age,
            class: {
                group1, group2
            },
            arr: [one, two, three]
        } = User;
        console.log(name, age, group1.one, group1.two, group2.one, group2.two, one, two, three);
    </script>

 

2. 杂项：如何反转一个对象的键值对：即将键和值反转

2.1 使用Object.keys()  获取一个对象的属性数组

       var obj = {
            a: 10,
            b: 20,
            c: 30
        };
        var keys = Object.keys(obj); //可以获取到对象的键,组成的数组
        console.log(keys);

2.2 对obj 进行键值反转：

        var obj = {
            a: 10,
            b: 20,
            c: 30
        };
        var keys = Object.keys(obj);  //可以获取到对象的键,组成的数组
        console.log(keys);            // ['a','b','c']
        var res = {};
        keys.forEach((val) => {
            res[obj[val]] = val;
        });
        console.log(res);             // {10:'a',20:'b',30:'c'}

 

2.3 使用hasOwnProperty()  来实现键值对反转

 

2.3.1  确认一下 hasOwnProperty 是否有效

        function Myobj() {
            this.a = 10;
            this.b = 20;
            this.c = 30;
        }
        Myobj.prototype.d = 40;                        // 在原型对象上加入一个属性 d ,值为 40 
        var obj = new Myobj();                         // 创建一个对象
        console.log(obj.d);                            // 40
        console.log(obj.hasOwnProperty('d'));          // false

结果：obj 能够调用d 的值，但是d 不是obj 本身的属性，所以显示false

2.3.2 键值对反转实现：

function Myobj() {
            this.a = 10;
            this.b = 20;
            this.c = 30;
        }
        var obj = new Myobj(); // 创建一个对象
        var keys = [];                                     //创建一个空数组接受obj 的键
        for (var key in obj) {
            if (obj.hasOwnProperty(key)) {
                keys.push(key);    
            }
        };
        var res = {};                                      //创建一个空对象接受反转后的对象
        for (var i = 0, len = keys.length; i < len; i++) {
            res[obj[keys[i]]] = keys[i];
        }
        console.log(obj);
        console.log(res);