将数组的单元值快速批量的赋值给一系列变量的简洁语法
变量的顺序对应数组单元值的位置依次进行赋值操作
const arr = [100,60,80];
//数组解构 赋值
const [max,min,avg] = arr;
//const [max,min,avg] = [100,60,80];
// const max = arr[0];
// const min = arr[1];
// const avg = arr[2];
console.log(max);
console.log(min);
console.log(avg);
Js
前面有两哪种情况需要加分号的?
立即执行函数
数组解构
变量的数量大于单元值数量时,多余的变量将被赋值为 undefined
const [a,b,c,d] = [1,2,3];
console.log(a);//1
console.log(b);//2
console.log(c);//3
console.log(d);//undefined
const [a,b] = [1,2,3]
console.log(a);//1
console.log(b);//2
const [a,b,...c] = [1,2,3,4];
console.log(a);//1
console.log(b);//2
console.log(c);//Array:[3,4]真数组 剩余参数返回的还是一个数组
const [a=0,b=0] = [1,2]
console.log(a);//1
console.log(b);//2
const [a=0,b=0] = []
console.log(a);//0
console.log(b);//0
const [a,,c,d] = ['小米','华为','格力','空调'];
console.log(a);//小米
console.log(c);//格力
console.log(d);//空调
// const arr = [1,2,[3,4]];
// console.log(arr[0]);//1
// console.log(arr[1]);//2
// console.log(arr[2]);//[3,4]
// console.log(arr[2][0]);//3
//支持多维数组的结构:
// const [a,b,c] = [1,2,[3,4]];
// console.log(a);//1
// console.log(b);//2
// console.log(c);//3,4
const [a,b,[c,d]] = [1,2,[3,4]];
console.log(a);//1
console.log(b);//2
console.log(c);//3
console.log(d);//4
对象解构是将对象属性和方法快速批量赋值给一系列变量的简洁语法
1. 基本语法:
赋值运算符 = 左侧的 {} 用于批量声明变量,右侧对象的属性值将被赋值给左侧的变量
对象属性的值将被赋值给与属性名相同的变量
注意解构的变量名不要和外面的变量名冲突否则报错
对象中找不到与变量名一致的属性时变量值为 undefined
// const obj = {
// uname:'pink老师',
// age:18
// }
// obj.uname
// 要求属性名和变量名一致
//对象解构的变量名可以重新改名
const {uname:username,age} = {
uname:'pink老师',
age:18
};
console.log(username);//pink老师
console.log(age);//18
//等价于 const uname = obj.uname
2.数组对象解构
//2.解构数组对象:
const pig = [{uname:'peiqi',age:18}]
const [{uname,age}] = pig;
console.log(uname);//peiqi
console.log(age);//18
3.多级对象解构:
const pig = {
name:'佩奇',
family:{
mother:'妈妈',
father:'爸爸',
sister:'乔治'
},
age:6
}
//多级对象解构
const {name,family:{mother,father,sister},age} = pig;
console.log(name);//佩奇
console.log(mother);//妈妈
console.log(father);//爸爸
console.log(sister);//乔治
console.log(age);//6
4.多级数组解构:
const person = [{name:'佩奇',
family:{
mother:'妈妈',
father:'爸爸',
sister:'乔治'
},
age:6
}
]
const [{name,family:{mother,father,sister},age}] = person;
console.log(name);//佩奇
console.log(mother);//妈妈
console.log(father);//爸爸
console.log(sister);//乔治
console.log(age);//6
练习: