ES6-变量的结构赋值

Posted 2021-03-09 maycpou

比如有一个对象obj={name:‘tom‘,age:11};，当我们需要将这个对象的name和age赋值给另外的变量时候，es5中是var name = obj.name;var age =obj.age;，在es6中针对这种将对象的属性（或者数组的值）赋值给外面的变量的需求，提供了一种更加简便的方式：

    //1 变量的解构赋值

    let obj = {name:‘tom‘,age:11};

    //这种对象的结构赋值要求定义的变量名必须和对象的属性名一致，在这里必须是变量名必须是name和age

    //也可以只取对象中的部分属性赋值为变量，如let{age} = obj;

    let {name,age} = obj;//相当于var name = obj.name;var age = obj.age;

    console.log(name+age);

    //2 数组的解构赋值

    let arr =[1,2,‘test‘,true];

    //数组的结构赋值变量可以随意命名，但是下标与数组中下标位置对应

    //也可以只取数组中部分值赋值给变量，如let[,,a]=arr;等价于var a = arr[2];

    let [a,b,c,d]=arr;//相当于var a = arr[0];var b = arr[2];‘...

    console.log(a);

    console.log(b);

    console.log(c);

    console.log(d);

    //3 变量的结构赋值在传参时的使用

    //以前的方式

    let obj1 = {name:‘jack‘,age:15};

    function fun(name,age){

        console.log(name +age);

    }

    fun(obj1.name,obj1.age);

    //利用变量的结构赋值

    function fun1({name,age}){

        console.log(name +age);

    }

    fun1(obj1);