ES6解构

1.数组解构

①基本语法：

赋值运算符=左侧的[]用于批量声明变量，右侧数组的单元值将被赋值给左侧的变量。

②变量的顺序

变量的顺序对应数组单元值的位置一次进行赋值操作。

例：let [a,b,c]=[1,2,3];

console.log(a,b,c);

③几种情况

1.正常解构

let [a,b,c]=['小米','苹果','华为'];

console.log(a);//小米

console.log(b);//苹果

console.log(c);//华为

2.变量少单元值多的情况

let [a,b,c]=['小米','苹果','华为','格力'];

console.log(a);//小米

console.log(b);//苹果

console.log(c);//华为

3.利用剩余参数解决变量少单元值多的情况

let [a,b,...other]=['小米','苹果','华为','格力','vivo'];

console.log(a);//小米

console.log(b);//苹果

console.log(c);//['华为','格力','vivo']

4.防止有undefined传递单元值的情况，可以设默认值

let [a='华为',b='苹果']=['小米'];

console.log(a);//小米

console.log(b);//苹果

5.按需导入忽略某些返回值

let [a,,b,c]=['小米','苹果','华为','格力'];

console.log(a);//小米

console.log(b);//华为

console.log(c);//格力

6.支持多维数组的解构

const [a,b]=['小米',['苹果','华为']];

console.log(a);//小米

console.log(b);//['苹果','华为']

2.对象解构

①基本语法：

1.赋值运算符=左侧的{}用于批量声明变量，右侧对象的属性值将赋值给左侧的变量

2.对象属性的值将被赋值给与属性名相同的变量

3.注意解构的变量名不要与外面的变量名冲突否则报错

4.对象中找不到与变量名一致的属性时变量值为undefined

例：let person={name:'zs',age:20};

let{name,age}=person;

console.log(name);//zs

console.log(age);//20

或 给新的变量赋值

let{name:myName,age:myAge}=person;

console.log(myName);//zs

console.log(myAge);//20

②数组对象解构

const pig =[{

           name:"佩奇",

           age:6

}]

const [{name,age}]=pig;

console.log(name);//佩奇

console.log(age);//6