es6——解构赋值

版权声明:转发博客 请注明出处 否则必究 https://blog.csdn.net/lucky541788/article/details/82531290

ES6允许按照一定模式从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)
1.基本用法

 {
        let name = 'bob', age = 18, sex = 'man';
        console.log(name, age, sex);//bob 18 man
    }
    {
        let [name, age, sex] = ['bob', 18, 'man'];
        name='lucy';
        console.log(name, age, sex);//lucy 18 man
    }

2.对象的解构赋值

    {
        let {name, age, sex} = {name: 'bob', age: 18, sex: 'man'};
        console.log(name, age, sex);//bob 18 man
    }
    //复杂对象解构赋值
    {
        let {name, age, sex, friends,pet} = {
            name: 'john',
            age: 18,
            sex: 'man',
            friends: ['bob', 'lucy'],
            pet: {name: 'dog', age: 4}
        };
        console.log(name, age, sex, friends,pet);//john 18 man (2) ["bob", "lucy"] {name: "dog", age: 4}
    }

3.数组解构赋值

  {
        let [name, age, sex] = ['bob', 18, 'man'];
        name = 'lucy';
        console.log(name, age, sex);//lucy 18 man
    }
    //复杂对象解构赋值
    {
        let [arr1, [arr2, arr3, [arr4, arr5]]] = [1, [2, 3, [4, 5]]];
        console.log(arr1, arr2, arr3, arr4, arr5);//1 2 3 4 5
    }
    {
        let [arr]=[];
        console.log(arr);//undefined
    }
    {
        let [a,,b,c]=[1,2,3];
        console.log(a, b, c);//1 3 undefined
    }

4.基本类型的解构赋值(实际应用比较少)

    {
        let [a,b,c,d,e]='bob';
        console.log(a, b, c, d, e);//b o b undefined undefined
    }
    {
        let [a,b,c,d,e]=12345;
        console.log(a, b, c, d, e);//error: 12345 is not iterable(number类型没有构造器 string类型有构造器)
    }

猜你喜欢

转载自blog.csdn.net/lucky541788/article/details/82531290