一 对象的展开运算符
1.展开对象
对象不能直接展开,必须在{}中展开
const apple={
color:'红色',
shape:'球型',
taste:'甜'
};
console.log({...apple});
console.log({...apple}===apple);
//对象的展开:把属性罗列出来,用逗号分隔,放到一个{}中,构成新对象
console.log({...apple});
2.合并对象
const apple={
color:'红色',
shape:'球型',
taste:'甜'
};
const pen={
color:'黑色',
shape:'圆柱形',
use:'写字'
};
console.log({...pen});
console.log({...pen,...apple});
console.log({...apple,...pen});
console.log({pen,apple});
console.log({...pen,apple});
二 对象展开运算符的注意事项
1.空对象的展开
如果展开一个空对象,则没有任何效果
console.log({...{}});
console.log({...{},a:1});
2.非对象的展开
如果展开的不是对象,则自动将其转为对象,再将其属性罗列出来
console.log({...1});
console.log(new Object(1));
console.log({...undefined});
console.log({...null});
console.log({...true});
如果展开运算符后面是字符串,他会自动转成一个类似数组的对象,因此返回的不是空对象
console.log({...'alex'});
console.log([...'alex']);
console.log(...'alex');
console.log({...[1,2,3]});
3.对象中对象属性的展开
不会展开对象中的对象属性
const apple={
feature:{
taste:'甜'
}
}
const pen={
feature:{
color:'黑色',
shape:'圆柱形'
},
use:'写字'
}
console.log({...apple});
console.log({...apple,...pen});
三 对象展开运算符的应用
1.复制对象
const a={x:1,y:2};
const c={...a};
console.log(c,c===a);
2.用户参数和默认参数
add(1,2)
const logUser=({
username="Zhangsan",
age=0,
sex='male'
}={})=>{
console.log(username,age,sex);
}
const logUser = (userParam) => {
const defaultParam = {
username: "Zhangsan",
age: 0,
sex: "male",
};
// const { username, age, sex } = { ...defaultParam, ...userParam };
// console.log(username, age, sex);
const param={...defaultParam,...userParam}
console.log(param.username);
};
logUser()