数组的解构赋值:
const arr = [1,2,3,4];
let [a,b,c,d] = arr;
// 此时a=1,b=2,c=3,d=4
更复杂的匹配规则:
const arr = ['a','b',['c','d',['e','f','g']]];
const [,b] = arr; // 取b的值
const [,,g] = ['e','f','g']; // 取g的值
const [,,[,,[,,g]]] = arr; // 取g的值
扩展运算符:
const arr1 = [1,2,3];
const arr2 = ['a','b'];
const arr3 = ['zz',1];
const arr4 = [...arr1,...arr2,...arr3];
// 此时arr4 = [1,2,3,'a','b','zz',1]
默认值:
const arr = [1,null,undefined,undefined];
const [a,b=2,c=2,d,e='aaa'] = arr;
// 此时a=1,b=null,c=2,d=undefined,e='aaa'
交换变量:
let a = 1;
let b = 2;
[a,b] = [b,a]; // a=2,b=1
接受多个 函数返回值:
function getUserInfo(){
return[
true,
{
name:'小明',
gender:'男',
id:'id'
},
'请求成功'
];
};
const [status,data,msg] = getUserInfo(123);
// status=小明,data=男,msg=id
对象的解构赋值:
const obj = {
saber:'阿尔托利亚',
archer:'卫宫'
};
const {saber,archer1} = obj;
// saber=阿尔托利亚,archer1=undefined
稍微复杂的解构赋值:
const player = {
nickname: 'Lyn',
master: '东海龙王',
skill:[
{
skillName: '龙吟',
mp: '100',
time: 6000
},
{
skillName: '龙卷雨击',
mp: '400',
time: 3000
},
{
skillName: '龙腾',
mp: '900',
time: 60000
}
]
};
const {nickname} = player;
const {master} = player;
const {skill:[skill1,{skillName},{skillName:sName}]} = player;
// skill没有值
// skill1={skillName:'龙吟',mp: '100',time: 6000}
// skillName=龙卷雨击,sName=龙腾
综合扩展运算符:
const obj = {
saber: '阿尔托利亚',
archer: '卫宫',
lancer: '瑟坦达'
};
const {saber,...oth} = obj;
// oth={archer:'卫宫',lancer:'瑟坦达'}
如何对已经申明了的变量进行对象的解构赋值:
let age;
const obj = {
name: '小明',
age: 22
};
let {age} = obj; // age=22
对象结构的默认值:
let girlfriend = {
name: '蛋蛋',
age: 17,
};
let {name,age=22,hobby=['学习']} = girlfriend;
// name=蛋蛋,age=17,hobby=['学习']
提取对象属性:
const {name,hobby:[hobby1]} = {
name: '蛋蛋',
hobby=['学习']
}; // name=蛋蛋,hobby1=学习,hobby没有值
const {name,hobby:[hobby1],hobby} = {
name: '蛋蛋',
hobby = ['学习']
}; // name=蛋蛋,hobby1=学习,hobby=['学习']
使用对象传入乱序的函数参数:
function AJAX(url,data,type='get'){
}; // url='/getInfo',data={a:1},type='get'
AJAX({
url: '/getInfo',
data: {
a:1
},
});
获取多个 函数返回值:
function getUserInfo(){
return{
status: true,
data: {
name: '蛋蛋'
},
msg: '请求成功'
};
};
const {status,data,msg} = getUserInfo(123);
// status=true,data={name:'蛋蛋'},msg=请求成功
字符串的解构赋值:
const str = 'I am abc';
const [a,b,c,...oth] = str;
// a='I',b='',c='a',oth=['m','','a','b','c']
提取属性:
const str = 'I am abc';
const {lengh,split} = str;
//length=8,split取用成功,但是无实际意义