“这是我参与8月更文挑战的第5天,活动详情查看:8月更文挑战”
对象字面量的增强
1.对象字面量是什么
实例化构造函数生成对象
const person=new Object();
person.age=18;
person.speak = function(){};
console.log(person);
对象字面量
const person={
age:18,
speak:function(){}
};
2.属性的简洁表示法
当键名和变量或者常量名一样的时候,可以只写一个
const age=18;
const person ={
// age:age
age
};
console.log(person);//{age: 18}
3.方法的简洁表示法
方法可以省略冒号和function关键字
const person={
// speak:function(){}
speak(){}
};
console.log(person);
方括号语法
1.方括号语法的用法
const prop = 'age';
const person = {};
person.prop=18;//{prop: 18}
person[prop]=18;//{age: 18}
方括号语法可以写在对象字面量中
const person = {
[prop]:18
};
console.log(console.log(person));//{age: 18}
2.方括号中可以放什么
类比 模板字符串${}
[值或者通过计算可以得到值的(表达式)]
const prop = 'age';
const func = ()=>'age1';
const person={
// [prop]:18,
// [func()]:18
// ['sex']:'male's
['s'+'ex']:'male'
};
console.log(person);
3.方括号语法和点语法的区别
点语法是方括号语法的特殊形式
const person = {};
person.age 等价于 person['age']
属性名由字母、数字、下划线以及$构成,并且数字还不能打头的时候可以使用点语法
age18_$ √
18age ×
合法标识符可以用来作为变量或常量名
当你的属性或方法名是合法标识符时,可以使用点语法,其他情况下使用方括号语法
函数参数的默认值
.函数参数默认值的基本用法
const multiply = (x,y)=>{
if(typeof y==='undefined'){
y=1;
};
return x*y;
};
console.log(multiply(2,2));//4
上述函数相当于
const multiply = (x,y=1)=> x*y;
console.log(multiply(2));//2
函数参数默认值的应用
1.接受很多参数的时候
const logUser = (username='zhangsan',age=0,sex='male')=>console.log(username,age,sex);
logUser('Alex',18,'male');
logUser();
2.接受一个对象作为参数
const logUser=options=>console.log(options.username,options.age,options.sex);
通过解构赋值传参
const logUser = ({username='zhangsan',age=0,sex='male'}={})=>console.log(username,age,sex);
const options={
username:'Alex',
age:18,
sex:'male'
};
传递一个值
options={username:'alex'}//alex 0 male
{username='zhangsan',age=0,sex='male'}={username:'alex'}
传递一个空对象
options={};//zhangsan 0 male
什么都不传递
**logUser();//相当于{username='zhangsan',age=0,sex='male'}=undefined前面讲过undefined和null解构都会报错
将{username='zhangsan',age=0,sex='male'}={},,此时{username='zhangsan',age=0,sex='male'}相当于参数options
{options={}}=undefined此时options是函数默认值{},,再进行对象解构{username='zhangsan',age=0,sex='male'}={}**
zhangsan 0 male
logUser(options);
注意事项
1.默认值的生效条件
不传参数,或者明确的传递undefined作为参数,只有这两种情况下,默认值才会生效
const multiply = (x,y=1)=>x*y;
console.log(multiply(2,0));//0
console.log(multiply(2,null));//0
console.log(Number(null));//0
console.log(Number(undefined));//NaN
console.log(multiply(2));//2
2.默认值表达式
如果默认值是表达式,默认值表达式是惰性求值的
3.设置默认值的小技巧
函数参数的默认值,最好从参数列表的右边开始设置
const multiply = (x=1,y)=>x*y;
console.log(multiply(undefined,2));//2 这里必须要书写undefined
const multiply = (x,y=1)=>x*y;
console.log(multiply(2));//2